如何影响Div的内容



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
  }

并从其他选择器中删除属性颜色。

最新更新