display:inline与display:block的区别 | css教程 | 胡鹏博客
首页 > CSS样式 > display:inline与display:block的区别 | css教程
2013三月25

display:inline与display:block的区别 | css教程

这些天在写样式的时候,总有时候在ie6下面的兼容性不太好,后来看了下同事切的页面,感觉兼容性比偶的好与是看了下他的代码,发现他用display:block;用的特别的少,因为display:block;在margin,margin-left的这上属性在ie6下在存在会放大一倍的效果,这里在前面我们也说过margin-left的兼容性问题

后来东莞seo查找了一些资料分析了display:inline与display:block到底有什么区别呢

display:block就是将元素显示为块级元素
block元素的特点是:
总是在新行上开始;
高度,行高以及顶和底边距都可控制;-也就是说height,line-height,margin的属性对它来说是起作用的。
宽度缺省是它的容器的100%,除非设定一个宽度
<div>, <p>, <h1>, <form>, <ul> 和 <li>是块元素的例子。

display:inline就是将元素显示为行内元素.
inline元素的特点是:
和其他元素都在一行上;
高,行高及顶和底边距不可改变;-也就是说height,line-height,margin的属性对它来说不起作用。
宽度就是它的文字或图片的宽度,不可改变。
<span>, <a>, <label>, <input>, <img>, <strong> 和<em>是inline元素的例子。
但是后来发现,加上float属性后,高,行高及顶和底边距都又可以改变了。

知道了这些特点,以后在控制网页样式上的兼容问题上就又会少出一些问题了。

更多

文章作者:东莞seo
本文链接地址:http://www.seostudying.com/1254.html
欢迎转载,转载请注明出处»胡鹏博客 [display:inline与display:block的区别 | css教程]

本文目前尚无任何评论.
您必须在 登录 后才能发布评论.