更改DIV(CSS)中的字体颜色

Question

我试图改变H2字体和H2链接字体的颜色和大小,基于它们所处的div但尚未成功.我究竟做错了什么？

 <style>
h2 {
color:fff;
font-size: 20px;
}
social.h2 {
color:pink;
font-size: 14px;
}
social.h2.h2color {
color:purple;
font-size: 10px;
}
tv.h2 {
color:green;
font-size: 14px;
}
tv.h2.h2color {
color:orange;
font-size: 10px;
}
 </style>

 <h2>List of Companies </h2>
 <div class="social">

 <h2>     <A href="http://www.facebook.com">Facebook     </a>
 <span class="h2color">Found in 2004     </span>     </h2> 
 blah blah blah 

 <h2>     <A href="http://www.twitter.com">Twitter     </a>
 <span class="h2color">Found in 2007     </span>     </h2>
 blah blah blah 

 </div>


 <div class="tv">

 <h2>     <A href="http://www.fox.com">Fox     </a>
 <span class="h2color">Found in 2004     </span>     </h2> 
 blah blah blah 

 <h2>     <A href="http://www.nbc.com">NBC     </a>
 <span class="h2color">Found in 2007     </span>     </h2>
 blah blah blah 
 </div>

我想让它看起来像这样:

Answer 1

你的第一个CSS选择器social.h2- 正在寻找"h2"类中的"社交"元素,例如:

<social class="h2">

类选择器前进一个点(.).另外,使用space() to indicate that one element is inside of another. To find an <h2>元素的后代social,请尝试以下操作:

.social h2 {
  color: pink;
  font-size: 14px;
}

为了更好地理解CSS选择器以及它们如何用于引用HTML,我建议您阅读CodeAcademy的交互式HTML和CSS教程.我希望这有助于指出你正确的方向.

Answer 2

要做链接,你可以做

.social h2 a:link {
  color: pink;
  font-size: 14px;   
}

您也可以更改悬停,访问和活动链接样式.只需将"链接"替换为您想要的样式.您可以在w3schools页面CSS链接了解更多信息.