css - 如何让css只影响一个按钮，而不是全部？

Question

我有一个有多个按钮的页面。我想使用 css 更改其中一个，但似乎无法弄清楚如何在 CSS 中做到这一点，而不更改所有这些。

<p>
     <button data-toggle="collapse" data-target="#acne" class="collapsed">Acne</button>
</p>
<div id="acne" class="collapse">
    <ul>
        <li>Blackheads</li>
        <li>Whiteheads</li>
        <li>Pimples</li>
        <li>Nodules or cysts</li>
        <li>Redness or flushing</li>
    </ul>
</div>
<p>
     <button data-toggle="collapse" data-target="#backpain">Back Pain</button>
</p>
<div id="backpain" class="collapse">
    <ul>
        <li>Pain in the lower back</li>
        <li>Pain, numbness, or tingling on one side of the buttocks or leg</li>
        <li>Weakness of the muscles in one leg</li>
    </ul>
</div>

我希望 Acne 的按钮具有不同的颜色和大小。任何帮助将不胜感激。

Answer 1

您可以给按钮一个ID 属性或一个类属性。

ID 是唯一的，而类可以由一个或多个元素组成。