元素的高度是由什么决定对于我们解决页面显示问题和布局页面都有很大的帮助。 常规的操作表现是为一个块级元素设置height属性,则其拥有了高度:
但是根据熟知,当我们不为元素设置height,而元素中有内容时,该元素依然获取到了高度:
1

为什么div获取到了高度,并不是由于文字撑起了高度,而是line-height撑起了div,比较一下两端代码
立即学习“前端免费学习笔记(深入)”;
.test {
border: 1px solid #ccc;
width: 100px;
line-height: 100px;
}
1
效果如下:

本支付接口的特点,主要是用xml文件来记录订单详情和支付详情。代码比较简单,只要将里面的商户号、商户key换成你自己的,将回调url换成你的网站,就可以使用了。通过这个实例也可以很好的了解一般在线支付接口的基本工作原理。其中的pay.config文件记录的是支付详情,order.config是订单详情
.test {
border: 1px solid #ccc;
width: 100px;
line-height: 0;
}
1
显而易见的结果就是因为有了height所以有高度,没有height则因为有了line-height而有了高度 更多详细的细节其实是因为 每一行文字 都有一个line boxes, 这些一个个盒子自然撑起了父元素的高度。
同时,观察上面的例子就能发现文字的中线和line-height的中线是在相同位置的,所以才有了常用的那套居中办法:
设置line-height和height相同数值则可以使得其中文字垂直居中
从结果来看确实如此,但是这句话不对,这句话多余了几个字,完全不需要设置height,只需要line-height就可以做到文字垂直居中了。









