避免子 div 中的父 div 属性答案

【问题标题】：Avoiding parent div properties in child div避免子 div 中的父 div 属性
【发布时间】：2012-09-29 23:04:12
【问题描述】：

我正在使用以下代码来居中对齐我的网页，

#parent{
      margin:0 auto;
      width: 960px;  
}
<div id="parent">
          <!--more code goes here-->
</div>

属性已移至所有子 div's，导致它们居中对齐。我不是CSS 编码员，但我记得有一个技巧可以让父级div 元素只粘在父级div 上。请帮忙。谢谢

【问题讨论】：

标签： html css

【解决方案1】：

#parent{
    margin: 0 auto;
    width: 960px;  
}

#parent * {
    margin: 0;
    width: auto;
}

【讨论】：

【解决方案2】：

#parent{
      margin:0 auto;
      width: 960px;  
}
#child{
      margin:0;
      width: 960px;  
}
<div id="parent">
<div id="child">
          <!--more code goes here-->
</div>
</div>

行得通，对吧？

【讨论】：

【解决方案3】：

为了避免让孩子继承属性，我通常会做的是让一个父母有两个孩子。我为每个孩子制作相同的 div。然后，我为其中一个 div 提供您不希望其他孩子拥有的属性，例如 opacity 或其他。之后，我将常规子布局 div 和内容放入子编号 2。这样，不需要的属性成为兄弟属性，而不是继承。

【讨论】：

【解决方案4】：

margin 和 width 属性不继承（通过使用 inherit 值除外）。但是，默认情况下，内部元素会在视觉上显示在外部元素中，因此看起来它可能继承了这些属性。实际上，例如margin-left 是 0（默认情况下），但这意味着元素从与其父元素相同的水平位置开始。类似地，width 是 auto 对于没有设置宽度的块元素，这意味着可用的水平空间。

解决问题的方法取决于问题所在。这些属性不存在继承问题。但是，如果您想制作例如居中元素的子元素从浏览器窗口的最左侧开始，您需要例如设置负边距或使用绝对定位。

对于许多其他属性，例如color，如果该属性未在元素本身上设置，则该元素会从其父元素继承该属性。如果不需要继承，请在内部元素上设置属性。没有诀窍；这就是 CSS 的工作原理。

【讨论】：