magin寫法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#d1{
width: 404px;
height: 404px;
border: 1px dashed black;
margin: 0 auto;
}
#d2{
width: 340px;
height: 340px;
border: 5px solid rgb(213,239,253);
margin-left: 27px;
margin-top: 27px;
}
#d3{
width: 299px;
height: 299px;
background-color: rgb(255,159,221);
border: 1px solid rgb(255,159,221);
margin-left: 20px;
margin-top: 20px;
}
#d4{
width: 216px;
height: 216px;
border: 1px dotted white;
margin-left: 41px;
margin-top: 41px;
}
#d5{
width: 208px;
height: 208px;
border: 1px dashed white;
margin-left: 3px;
margin-top: 3px;
}
#d6{
width: 100px;
height: 100px;
background-color: rgb(134,255,82);
border: 5px solid rgb(251,255,67);
margin-left: 49px;
margin-top: 49px;
}
</style>
</head>
<body>
<div id="d1">
<div id="d2">
<div id="d3">
<div id="d4">
<div id="d5">
<div id="d6"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
padding寫法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#p1{
width: 350px;
border: 1px dashed black;
padding: 27px;
}
#p2{
border: 5px solid rgb(213,239,253);
padding: 20px;
}
#p3{
background-color: rgb(255,159,221);
padding: 41px;
}
#p4{
border: 1px dotted white;
padding: 3px;
}
#p5{
border: 1px dashed white;
padding: 49px;
}
#p6{
height: 100px;
background-color: rgb(134,255,82);
border: 5px solid rgb(251,255,67);
}
</style>
</head>
<body>
<div id="p1">
<div id="p2">
<div id="p3">
<div id="p4">
<div id="p5">
<div id="p6"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。