html - Change Color of Fonts in DIV (CSS)

Question

I am trying to change the color and size of H2 font and H2 link fonts based on the div they are in but have not been successful. What am I doing wrong?

 <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>

I am trying to make it look like this:

Answer 1

您的第一个 CSS 选择器——<code>social.h2——正在“h2”类中寻找“social”元素，例如：

<social class="h2">

类选择器以点 ( .) 开头。此外，使用空格 ( ) 表示一个元素在另一个元素之内。要在类中查找<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 链接了解更多信息。