Html css选择器：“css选择器”之间的区别；主体h1"&引用；正文.h1“；及；正文.h1“；_Html_Css_Twitter Bootstrap

Html css选择器：“css选择器”之间的区别；主体h1"&引用；正文.h1“；及；正文.h1“；

html css twitter-bootstrap

Html css选择器：“css选择器”之间的区别；主体h1"&引用；正文.h1“；及；正文.h1“；,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,我试图理解css规则将应用于哪些元素： body h1, body .h1 { font-family: 'Open Sans', sans-serif !important; color: inherit; text-rendering: optimizelegibility; } 我理解body.h1，但不理解body h1也不理解body.h1 body.h1将选择body元素（如果其类为h1）。（例如这一个） body h1将选择body中的所有h1元素。

我试图理解css规则将应用于哪些元素：

body h1, body .h1 {
    font-family: 'Open Sans', sans-serif !important;
    color: inherit;
    text-rendering: optimizelegibility;
}

我理解

body.h1

，但不理解

body h1

也不理解

body.h1

```
body.h1
```
将选择
```
body
```
元素（如果其类为
```
h1
```
）。
- （例如这一个）
```
body h1
```
将选择body中的所有
```
h1
```
元素。
- （例如这一个）
- 这在格式良好的HTML中是多余的，它基本上会做与
```
h1
```
  相同的事情，因为
```
h1
```
  元素只能放在主体中（如果您的HTML格式良好）
```
body.h1
```
将选择body中具有
```
h1
```
类的所有元素。
- （例如这一个）

因此，

body h1，body.h1

将选择：

<body>
    <h1>this element</h1>
    <div class='h1'>and this one too</div>
</body>


这个元素
还有这个

```
body.h1
```
选择类为
```
h1
```
的
```
body
```
```
body h1
```
选择
```
body
```
元素中任何位置的所有
```
h1
```
元素
```
body.h1
```
选择
```
body
```
元素内部具有类
```
h1
```
的任何类型的所有元素

CSS中的选择器将所有

h1

元素以及标记的

正文

中任何类型的

h1

类元素作为目标。

正文h1

它会在你体内找到所有的h1

body.h1

它将在您的主体中找到所有具有类h1的元素

主体h1

：作为

主体

元素后代的所有

h1

元素

body.h1

：具有类

h1

的所有元素，它们是

body

元素的后代

小提琴：

主体h1

将处理

-元素中的所有

-元素：

<body>
    <h1>This one</h1>
    <div>
        <h1>And also this one</h1>
    </div>
</body>

body.h1

最终将在具有类

h1

时设置

-元素本身的样式：

<body>
    <h1 class="h1">This one</h1>
    <div class="h1">And also this one</div>
</body>

<body class="h1"></body>

最好做一些阅读。+你不需要选择

body

作为父母，只有

h1、.h1

足够感谢你的回答，我现在明白了。我只是不明白为什么bootstrap使用

h1

作为类名，它可能会与html

h1

元素混淆