-2

我是 CSS 和 HTML 的初学者，因为我正在尝试在 Weebly 上制作网页时学习

container无论如何，我几乎在每个 div id 之后都会看到一个div 类。我正在查看 CSS，只看到 div 类本身的边距和宽度属性，但container在所有 id 选择器之后将该类视为子元素。我想知道这个container类实际上做了什么以及为什么需要它。

例子：

.container {
    margin: 0 auto;
    width: 960px;   
}

#nav-wrap {
    background: url(nav-bg.jpg);
    box-shadow:0 1px 2px 1px rgba(0,0,0,0.25);
    position:relative;
    z-index:3;
}

#nav-wrap .container {
    clear: both;
    overflow: hidden;
    position: relative;
    width: 960px;
    box-shadow:none;
}

在上面的例子中，哪个区域#nav-wrap指示，哪个区域#nav.wrap .container指示？

谢谢！

4

2 回答 2

0

首先在这段代码中：

.container {
    margin: 0 auto;
    width: 960px;   
}

这margin: 0 auto意味着具有类.container中心水平对齐的对象，其余的是历史...

#nav-wrap之后和之间的区别#nav-wrap .container：

假设我们有一个这样的 html 代码：

<div id="nav-wrap">
    ...
    <div class="container">
        ...
    </div>
    ...
</div>

在此代码中，使用您编写的样式，#nav-wrap .container选择器仅将样式应用于内部div标记，但#nav-wrap将其样式应用于整个代码。换句话说，内部div继承了nav-wrap样式，但反之则不然。我希望你明白...

于 2014-06-21T03:33:04.630 回答
0

#nav-wrap将对应一个 html 标签 id 作为 nav-wrap。 nav-wrap container将是复合样式；它将是 nav-wrap 和容器样式都适用的区域。阅读源代码。如果您愿意修改，您可能会发现带有轮廓的绘图框或更改 div 背景颜色具有指导意义。

于 2014-06-21T02:15:49.943 回答