Question

我想给面板标题类一个标识符，这样我就可以在我的css中定位它而不改变任何其他面板标题，我该怎么做呢？

<div class="panel panel-default">
    <div class="panel-heading"><h2 class="login">Welcome Back!</h2>
    </div>`

Answer 1

有几种方法可以做到这一点：

将另一个类添加到您所指的特定panel-heading：
```
<div class="panel-heading classname">
```

然后通过CSS使用.panel-heading.classname { }

使用子选择器仅定位您需要的面板标题：

.panel:first-child > .panel-heading { }
.panel:last-child > .panel-heading { }
.panel:nth-child(2) > .panel-heading { }

从上面的第2点可以看出，我在父.panel类上使用子选择器，然后只选择该父级的.panel-heading。

请注意上面第n个孩子选择器中的（2）可以更改为选择你需要的任何东西（在我给出的例子中，它显然会针对第二个）。

Answer 2

您可以通过在class属性中添加第二个类来添加第二个类，这些类必须用空格分隔。

在您的情况下，它将是：

<div class="panel panel-default custom_class"> <!-- Note the new class -->
    <div class="panel-heading"><h2 class="login">Welcome Back!</h2>
</div>

然后，您可以在CSS中执行以下操作：

.custom_class {
    /* Your styles */
}

希望这有帮助！

Answer 3

简单地添加你的类，Bootstrap只是一组现成的css类，可以与其他类一起使用，也可以被覆盖

<div id="my_css_id" class="panel panel-default my_css_class_1">
    <div class="panel-heading my_css_class_1">
      <h2 class="login">Welcome Back!</h2>
   </div>
</div>

Answer 4

HTML

.xcodeproj

CSS

<div class="panel panel-default Add-custome-class">
    <div class="panel-heading">
       <h2 class="login">Welcome Back!</h2>
    </div>
</div>`

如何将类添加到默认引导类

4 个答案: