不同浏览器技术不同,在DIV+CSS设计的时候,会显示不同的效果,设计师如果平时不注意调试的话,到时候会让自己吃一惊!
举例说明
我们定义两个DIV快
代码如下
<style type="text/css">
<!--
.abc {
background-color: #FF0000;
height: auto;
width: 300px;
}
.cde {
background-color: #80FF80;
height: auto;
width: 300px;
}
.STYLE1 {color: #FFFFFF}
.STYLE2 {color: #030303; }
-->
</style>
</head>
<body>
<div class="abc">
<p class="STYLE1">第一个快定义,宽度为200PX,高度为自动</p>
</div>
<div class="cde">
<p class="STYLE2">第二个快定义,宽度为200PX,高度为自动</p>
</div>
</body>
</html>
在IE浏览器中得到的效果,正是最处设想的效果,可是在firefox和Opera浏览器中就不是想象的效果,效果图如下:
![]() |
大家看到,在firefox和Opera浏览器中,两个DIV快之间空出一行来,
那怎么设置CSS才会让那空出的一行变为无间隔,其实只要定义个P的边界和填充为0px就好了
p{margin:0px;padding:0px;}
定义了这个后,三种浏览器才会得到一样的效果
上一篇链接:下面没有链接了
下一篇链接:符合W3标准的常见设置
【评论】【加入收藏夹】【打印】【关闭】