为什么这个css布局练习的代码在浏览器中body会有8px的margin，不是清零了吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>混合布局编程挑战</title>

.body{ margin:0; padding:0; font-size:30px; color:#fff}

.top{background:#ccc;height:100px;margin:0 auto;}

.main{background:red;height:400px;}

.left{background:blue;height:400px;width:200px;float:left;}

.right{background:green;height:400px;position:absolute;left:0;}

.foot{background:orange;margin:0 auto;clear:both;}

</style>

</head>

<body>

<div class="right">right</div>

</div>

</body>

</html>

newsudhc3634140

浏览 2117回答 3

blovetu

选择器用错了，.body前面的点去掉就好了，你可以先写个*{margin: 0; padding: 0;}把所有元素的边距都清除掉，因为除了body，像p、ul、ol、h1~h6……都有外边距或者内边距，如果你每用一次这里的标签清一次边距会比较麻烦，所以统一清一下边距，也省去很多麻烦

辉狼

*{magin :0 auto ;}

Caballarii

选择body直接写body就行了，前面加了点代表取class是body的元素body{ margin:0; padding:0; font-size:30px; color:#fff}

随时随地看视频慕课网APP