css样式top的简单介绍

css中margin-top和top有什么区别

一、功能不同

成都创新互联是专业的莲花网站建设公司，莲花接单;提供成都网站设计、做网站,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行莲花网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

1、margin-top：功能为设置元素的上外边距。

2、top：规定元素的顶部边缘。

二、特点不同

1、margin-top：允许使用负值。定义固定的上外边距。默认值是 0。

2、top：定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。

三、规定不同

1、margin-top：所有主流浏览器都支持 margin-top 属性。

2、top：如果 "position" 属性的值为 "static"，那么设置 "top" 属性不会产生任何效果。

参考资料来源：百度百科-CSS top

参考资料来源：百度百科-CSS margin-top

当css样式为绝对定位（即position:absolute; ）时，left ， right ， top ， bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据 body 对象。

我们都知道不同的浏览器有些规则是不同的，所以css样式为了使页面在不同浏览器下显示效果一致，就出现了hack 例如，下划线“_”只有ie6可以识别，ie7 、火狐等浏览器是不识别的，也就是说

top:0px; /*ie7,firefox执行这句 */

_top:6px;/*ie6执行这句*/

而且这个顺序不能颠倒哦

还有类似的hack写法

top:0px !important; /*火狐，ie7能识别*/

top:6px;/*ie6识别这句*/

看出来了么，css中hack写法浏览器也是有优先级别的，一般来说是ie7火狐ie6.谨记定义同样属性，顺序别颠倒了

_top就是top，是为了兼容IE6.0浏览器的一种 CSS hack 技术

background-color:#f1ee18;/*所有识别*/

.background-color:#00deff\9; /*IE6、7、8识别*/

+background-color:#a200ff;/*IE6、7识别*/

_background-color:#1e0bd1;/*IE6识别*/

文章名称：css样式top的简单介绍
本文地址：http://ybzwz.com/article/dsgghoc.html