沒有聽明白滾動容器上下留白
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0px;padding:0px;}
.box{
background:grey;
padding:50px 0px;
}
img{width:150px;height:300px;}
</style>
</head>
<body>
<div>
<img src="psb.jpg">
</div>
</body>
</html>
給父容器使用padding:50px 0px;圖片上下都有留白啊
2017-07-16
"padding:50px 0px;",從盒子模型上理解是正確的,但是瀏覽器世界因為各種內核等原因,瀏覽器對這些參數的理解并不相同,是否能行要看具體是哪種瀏覽器以及瀏覽器的哪種版本,這種方式兼容性不強,只能被少數瀏覽器正確識別。
"margin:50px 0px;",從盒子模型上理解也是正確的,且這種方法的兼容性要好很多,絕大多數瀏覽器都能正常顯示。