html
<span class = "Box">
<div class = "active">
<a href ="#-night">
<span class ="list">4</span>
<span class="locations"><?php echo $location; ?></span>
<span class="type">Night </span>
</a>
</div>
</span>
CSS
.Box {
white-space: nowrap;
padding: 0px 20px;
font-size: 110%;
color: blue;}
.list {
height: 30px;
width: 30px;
line-height: 30px;
-moz-border-radius: 15px; /* or 50% */
border-radius: 15px; /* or 50% */
text-align: center;
display: inline-block;
background-color: orange;
color: blue;}
.locations{
text-transform: uppercase;
color: blue;}
.type {
text-transform: uppercase;
color: blue;}
我希望。活动跨度可以更改.List,Locations和.type的字体颜色为深蓝色或任何其他颜色
我不是CSS的专家,在线寻找没有任何答案。很抱歉,如果我发布了这个错误或提出愚蠢的问题。
.active .list,
.active .locations,
.active .type {
color: darkBlue;
}
示例...
.Box {
white-space: nowrap;
padding: 0px 20px;
font-size: 110%;
color: blue;}
.list {
height: 30px;
width: 30px;
line-height: 30px;
-moz-border-radius: 15px; /* or 50% */
border-radius: 15px; /* or 50% */
text-align: center;
display: inline-block;
background-color: orange;
color: blue;}
.locations{
text-transform: uppercase;
color: blue;}
.type {
text-transform: uppercase;
color: blue;}
.active .list,
.active .locations,
.active .type {
color: darkBlue;
}
<span class = "Box">
<div class = "active">
<a href ="#-night">
<span class ="list">4</span>
<span class="locations"><?php echo $location; ?></span>
<span class="type">Night </span>
</a>
</div>
</span>
添加此 - :
a {
color :red; // your color here
}
并从其他选择器中删除属性颜色。