Question

我将此HTML代码作为示例：

<body>
    <div class="jumbotron">
        <h1>Bootstrap Example</h1> 
        <p>Just another crazy blog</p> 
    </div>

   <div class="container">
      <p>This is some text.</p> 
      <p>This is another text.</p> 
  </div>

我正在尝试使用以下代码设置jumbotron的样式：

.jumbotron h1, p{
  color: #FAE3F2;
  font-family: 'Orbitron', sans-serif;

}

问题是，当我应用这些更改时，它们也会影响容器内的段落，我无法理解原因。我做错了什么？

Answer 1

试试这个

.jumbotron h1, .jumbotron p{
  color: #FAE3F2;
  font-family: 'Orbitron', sans-serif;

}

,分隔整个表达式，因此.jumbotron不会转移到第二个表达式。

Answer 2

用这一个替换选择器：

.jumbotron h1, .jumbotron p {...}

让您的选择器没有.jumbotron p {..}意味着将选择所有p元素。

如何在CSS中选择另一个元素？

2 个答案: