line-height与height高度相同,为什么就上下居中了

我试验了下，好厉害，为什么呢

推荐答案推荐于2016-06-02

height是块高度，line-height是单行高度。正常理解，在没有div的页面中，在一行里面，文字是垂直居中的。
默认文字的单行高度是和文字的大小相关的，在此情况下，只显示一行的块，人为指定的块高度和单行的高度就不相同，导致了文字不能垂直居中，此时将单行高度强行设置为块高度，就去除了文字大小的影响，实现了文字的垂直居中效果！

温馨提示：答案为网友推荐，仅供参考

当前网址：http://66.wendadaohang.com/zd/UvDs2UDsx9xxinn2sDi.html

其他回答

第1个回答 2013-10-24

浏览器默认的文本渲染方式就是使文字居中于line-height中，参考：
http://www.w3school.com.cn/css/pr_dim_line-height.asp

有一个特殊的属性可以修改这个css设定
代码我忘记了，抱歉

第2个回答 2013-10-24

这你得问开发HTML CSS的人了

相似回答

为什么在div中当height和line-height一样的时候他会居中对齐,我想知道...答：height是div实际的高度 line-height是div内文字占据的高度当行高比实际高度大时，虽然ie会撑开div，但两者的显示方式互不影响。当两者相等时，显示效果上文字是垂直居中的，可是如果你再添加一行文字呢？？

CSS为什么行高line-height与文字高度height设为一样大,文字就垂直居中...答：③结合以①②中的两个等式：当设置line-height等于height时，字符大小就是内容大小，而上下相同的行间距就相当于上下相同的padding。故，div中的内容居中=p元素的字符(撑满容器)居中。“如果此时我把行高调为60px，那么文字中心点距上或者距下各为30px，那不仍然是垂直居中吗？”你想想，你说的“垂直...

CSS为什么行高line-height与文字高height一样就能让文字居中? 有没有...答：line-height 属性的取值和 height 属性的取值是相同的，这样内部的一行文本就实现垂直居中。在CSS中，line-height 属性的调整就是以这条线为标准线的。换句话说，当line-height属性设置为一定的数值时，段落中任意两行的行距就是这两行基线之间的距离。

HTML代码里面的文字段落怎么设置水平对齐答：第一种,上下居中文字:方法是使用line-height,因为line-height就是用来定义文字行与行之间的距离,所以定义文字框的line-height等于框的高度可以让文字上下居中.h1 { font-size: 3em; height: 100px; line-height: 100px; }第二种,非文字的上下居中:使用absolute positioning，需要注意的是...

为什么一个div行高是30px,定义行高是30就会居中答：你好！希望我的回答你能采纳！行高的代码是line-height，该代码只对文字起作用。关于你的问题div设置高度（height:30px;）并设置(line-height：30px;)文字会居中的原因是这样的。图片中所示，绿色div的高为30px；设置line-height为30px时，首页文本居中。分析：line-height是针对文本，文字首页是一行...

为什么设置line-height文字会居中答：所以不是行高line-height与文字高height一样就能让文字居中，而是应该这样理解，字符本来就在行高内垂直居中了，只是行高与文字的盒子高度不等，导致不能在盒子里垂直居中，如果我们把行高line-height与盒子的height设置为一样大，意思就是行高的平行线与盒子的上下边重合了，这时字符当然仍是在行高内垂直...

大家正在搜

css line height line height属性 css上下居中怎么弄 vertical-align div文字上下居中 flutter输入框文本居中 css文本上下居中上下居中样式 height