首页 > 代码库 > 盒子模型的理解
盒子模型的理解
<!DOCTYPE html> <html> <head> <title>盒子模型的理解</title> <meta charset="utf-8"> <style type="text/css"> *{ margin: 0; } .model{ width: 300px; height: 301px;
border: 10px solid; border-left: 20px dotted #fc4;
padding: 30px; padding-top:10px;
margin: 20px; margin-top: 50px; background-color: #faa; }
.model2{ width: 280px; height: 480px; background-color: #faa; /*text-align: center;*/ /*padding-left: 50px;*/ /*PS:方法一 使用model2的padding*/ padding-top:100px; } .time{ font-size: 80px; font-family: Arial; font-weight: bold; /*PS:方法二 使用.time的padding*/ padding-top: 100px; color: #fff; } </style> </head> <body> <!-- <div class="model"> 花花 草草 怎么办？(盒子模型的理解1) </div> -->
<div class="model2"> <div class="time"> 3:30 </div> </div>
</body> </html>
盒子模型的理解