类重写主标记

Question

我在css的第69行有以下代码

.container {width:1000px;margin:0 auto;padding:0 10px;}

以下第119行

main {margin:20px auto;}

然而，我的html中的元素是<main class="container"></main>，.container上的边距会覆盖main上的边距，即使在{c}之后加载了main 。谁能告诉我为什么这是???

Answer 1

类选择器（如.foo）比类型选择器（如bar）更具体。特异性用于确定应用规则的顺序。源代码顺序是抢占条件。

有关详细信息，请参阅the specificity rules in the CSS 2.1 specification。

Answer 2

优先级在css中最重要。始终为id选择器提供高优先级 然后是类选择器，然后priorty来自elemnent或标签选择器

Priority

1) # - id selector

2) . - class selector

3) <> - element or tag selector

在示例中

<main class="container"></main>

main是标记，容器是包含在主标记中的类。从css类选择器（容器）获取比元素选择器（main）更多的优先级。所以它覆盖了主标签的属性。