桑桑不会写程序 2022-10-07 17:26 采纳率: 100%
浏览 16
已结题

友友们。关于前端问题盒子模型的问题想要询问一下

这是呈现出来的效果

img


这是我编写的语言

             }
<DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="utf-8">
  <title>盒子</title>

  <style>
  *{
     padding:0;
     margin:0;

     }

   #container{
                      width:1000px;
                      height:500px;
                      margin:0 auto;
                     

                   }
  #header{
                 height:100px;
                 background:pink; 
                 margin-bottom:5px;

               }


  #main{
              height:500px;
              background:#cff;
             margin-bottom:5px;

            }

 #footer{
               height:30px;
               background:pink; 

 </style>


 </head>
 <body>
  <div id="container">
   <div id="header"></div>
   <div id="main"></div>
   <div id="footer"></div>
  </div>
 </body>
</html>

问题1:对于样式的设置中header,main中的margin-bottom部分我之前有想过为什么不是padding-bottom,后面觉得时因为这只是三个盒子,所以才要对header,main设置为margin-bottom,请问这个思路是对的吗?
/*
盒子模型一直学的不好,谢谢大家了*/

  • 写回答

1条回答 默认 最新

  • 游坦之 全栈领域优质创作者 2022-10-07 17:46
    关注

    看实际需要吧,margin是外边距 ,padding是内边距
    二者的效果如下,有用记得采纳呐

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 10月15日
  • 已采纳回答 10月7日
  • 创建了问题 10月7日

悬赏问题

  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么
  • ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
  • ¥16 mybatis的代理对象无法通过@Autowired装填
  • ¥15 可见光定位matlab仿真
  • ¥15 arduino 四自由度机械臂
  • ¥15 wordpress 产品图片 GIF 没法显示
  • ¥15 求三国群英传pl国战时间的修改方法
  • ¥15 matlab代码代写,需写出详细代码,代价私
  • ¥15 ROS系统搭建请教(跨境电商用途)
  • ¥15 AIC3204的示例代码有吗,想用AIC3204测量血氧,找不到相关的代码。