css - 在一个元素上使用两个 CSS 类

Question

我在这里做错了什么？

我有一个 .social div，但在第一个上我想要在顶部填充零，在第二个上我想要没有底部边框。

我试图为此首先和最后创建类，但我认为我在某处弄错了:

.social {
    width: 330px;
    height: 75px;
    float: right;
    text-align: left;
    padding: 10px 0;
    border-bottom: dotted 1px #6d6d6d;
}

.social .first{padding-top:0;}

.social .last{border:0;}

和 HTML

<div class="social" class="first">
    <div class="socialIcon"><img src="images/facebook.png" alt="Facebook" /></div>
    <div class="socialText">Find me on Facebook</div>
</div>

我猜不可能有两个不同的类(class)吧？如果可以，我该怎么做？

Answer 1

如果你想在一个元素上使用两个类，可以这样做:

<div class="social first"></div>

像这样在 css 中引用它:

.social.first {}

例子:

https://jsfiddle.net/tybro0103/covbtpaq/