如何使用div在屏幕里居中,div里的文字也居中.
屏幕居中且文字居中.png
/*
*css class selector
*使用: class="center"
*/
.center {
text-align: center;
color: blue;
font-size: 20px;
border-radius: 10px;
background-color: gray;
width: 50%;
height: 100px;
/*文字在div里居中,这里设置为跟div高度一样*/
line-height: 100px;
/*使div在屏幕里居中*/
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
<div class="center">屏幕居中,文字居中</div>
如何使用div在屏幕里居中,div里的文字也居中. 使用实例:
# 让div在屏幕上居中（水平居中+垂直居中）的方法总结 - html代码如下： - Css居中方法 （敲黑板）...
1、div中单行文字的垂直居中 在div中单行的文字需要垂直居中时，只需要对所在的div添加行高line-heig...
垂直居中 height:div的高度line-height:div的行高 并且水平居中 text-align:规定...
mark一下 方法一 方法二
文字水平居中 图片水平垂直居中 图片与文字水平垂直居中 代码同上 DIV相对于页面垂直居中并且响应式 视口绝对垂直...
line-height不能解决img在div内垂直居中，div 加入下面css代码，可以实现img垂直居中了 文字...
CSS水平居中、垂直居中、水平垂直居中方法总结 文字的水平居中: 单行文字的垂直居中： 让有宽度的div水平居中：...
1、水平居中（宽度未知） 例：有两个div，大的div包裹着小的div，如何使小的div水平居中在大的div中？ ...
文字在div中垂直居中显示 -方法1：将div改为table格式css如下： html如下： -方法2：将div改...
本文标题：div屏幕居中，并且文字在div居中
本文链接：https://www.haomeiwen.com/subject/thfioftx.html
网友评论