css - css中相同的元素不同的颜色

Question

将不同的背景颜色应用于同一元素的正确方法是什么？ 例子

 <div id="mainmenumess">
   <p class="incmessage">must be blue</p>
   <p class="incmessage">must be red</p>
 </div>

CSS

#mainmenumess .incmessage{
-webkit-border-radius: 5;
-moz-border-radius: 5;
border-radius: 5px;
color: #ffffff;
background: #de2424;
padding: 0px 5px 0px 5px;
text-decoration: none;
cursor:pointer;
}

#mainmenumess .incmessage:hover {
background: #ed4747;
text-decoration: none;
}

如果是红色就一定有 hover 蓝色没有 hover

Answer 1

所以从它的声音来看，第一个是红色的，其他的都是蓝色的？你会想做这样的事情:

#mainmenumess .incmessage:first-child {
    color: red;
}

#mainmenumess .incmessage {
    color: blue;
}