行内元素外边距的有关问题

行内元素外边距的问题

HTML code

<div style="margin:10px;background:blue">    <span style="margin-top:20px;background:red;">aaaaaaaa</span></div>

<span>标签算是行内元素吧，但是为什么margin-top属性没发挥作用呢？它应该不会有重叠外边距的问题吧。

[解决办法]
margin-top
margin-bottom 对 行内元素 无效，可以使用 padding
[解决办法]
你在 <span>标签上再加个display:block;
margin就有效了
如：

HTML code

<div style="margin:10px;background:blue">    <span style=" display:block;margin-top:20px;background:red;">aaaaaaaa</span></div> 

 

查看更多 下一篇