inline 元素的越界行为

in Share with 0 comment

inline 元素的越界行为

设置为 inline 的元素会忽略任何 width、height、margin-top 和 margin-bottom 设置,但是margin-left、margin-right 和 padding 依然有效

正常显示

margin-left、margin-right 和 padding-left、padding-right 正常显示

越界行为

设置 display: inline 的元素接受 padding 的设置,padding-top 和 padding-bottom 会越界进入相邻元素的区域,而不是局限于元素本身的空间

1554030858883

可以明显看到 .b 的 inline 元素的上下内容都侵入了相邻的元素当中