CSS中为什么padding-left对内联元素中换行后的第二行文字没有效果?

咕噜噜kkk 发布于 2016/10/31 16:43
阅读 241
收藏 0
加载中
0
此夜明月光

个人浅见:你使用<br/>在行内元素的内容中换行时,并不是将行内元素的内容分成了多行显示,而是将行内元素本身截成了很多行来显示。也就是说行内元素的高度并没有被你分开的内容撑起来,而是将自身分成几行显示,高度还是一行的高度。后面的几行在浏览器看来还是接着第一行的,而不是另起一行,虽然它另起一行显示了。所以只有第一行的内间距有效。可以将行内元素的dispaly属性设为inline-block来达到你想要的效果。块状元素时内容在换行,而非元素在换行。

0
wuyiw
wuyiw

http://runjs.cn/code/cczmnv9e

看第二行, 可以看到是一行被wrap成很多行显示, 就像一条盘缩的蛇, padding-left是蛇头的padding, padding-right则是蛇尾的padding.

参考来源: http://stackoverflow.com/questions/32022042/what-does-mean-line-box-in-css

返回顶部
顶部