css 3像素bug
关键词:css3像素差别,像素,差别,css测试3像素bug
查看效果:css 3像素bug
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css3像素差别BUG</title>
<style type="text/css">
<!--
body {
margin: 0px;
padding: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
}
* {
margin: 0px;
padding: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
list-style-type: none;
font-size: 12px;
}
.header {
height: 30px;
width: 300px;
background-color: #CCCCCC;
}
.content {
clear: both;
width: 300px;
overflow: hidden;
}
.menu {
clear: left;
float: left;
height: 30px;
width: 100px;
background-color: #FF99FF;
}
.menu2 {
clear: left;
float: left;
width: 100px;
background-color: #CCFFFF;
height: 30px;
}
.menu3 {
clear: left;
float: left;
height: 30px;
width: 100px;
background-color: #00CC99;
}
.main {
zoom:1;
height: 90px;
width: 195px;
background-color: #FF0000;
margin-left: 105px;
_margin-right: -3px;
}
.footer {
height: 30px;
width: 300px;
background-color: #FFCC66;
}
-->
</style>
</head>
<body>
<div class="header">此处显示 class "header" 的内容</div>
<div class="content">
<div class="menu">此处显示 class </div>
<div class="menu2">此处显示 class</div>
<div class="menu3">此处显示 class </div>
<div class="main">此处显示 class "main" 的内容</div>
<div class="footer">此处显示 class "header" 的内容</div>
</div>
</body>
</html>