Question

我正在学习bootstrap，我想知道offset是如何设置的父元素应用于子元素，以及将样式直接应用于子元素的意义是什么？我在一个受欢迎的网站上看到了方案1类型的引导程序。

情景1：

<div class = "footer-offset-padding navbar-offset-padding">
  <div class="navbar">
  </div>
  <div class="main">
  </div>
  <div class="footer">
  </div>
</div>

CSS：

  .navbar-offset-padding  {
        padding-top: 40px;
    }
   .footer-offset-padding   {
        padding-bottom: 40px;
    }

情景2：

<div class = "nothing">
  <div class="navbar navbar-offset-padding">
  </div>
  <div class="main">
  </div>
  <div class="footer footer-offset-padding">
  </div>
</div>

CSS：

.navbar-offset-padding  {
   padding-bottom: 20px;
}
.footer-offset-padding{
    padding-top: 20px;
}

作为一个初学者，如果我想要填充，我会采用类似于场景2的方法。我无法理解，第一个场景是如何工作的。为什么我们不添加填充＆＃34;直接添加到元素本身（在这种情况下为页脚和页眉）＆＃34; 。在应用场景1时是否还有其他好处。请指导一下。我甚至不确定Scenario 1为什么/如何工作？

偏移填充如何从父iteslf应用于子元素

0 个答案: