我正在努力根据他们所在的div来改变H2字体和H2链接字体的颜色和大小,但还没有成功.我究竟做错了什么？
<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>
我试图让它看起来像这样：
解决方法
您的第一个CSS选择器social.h2正在寻找“h2”中的“社交”元素,类,例如：
<social class="h2">
类别选择器继续进行点(.).另外,使用一个space()表示一个元素在另一个元素之内.要找到< h2>在社会阶层的一个元素的后裔,尝试像：
.social h2 {
color: pink;
font-size: 14px;
}
为了更好地了解CSS选择器以及它们如何用于引用您的HTML,我建议您完成interactive HTML and CSS tutorials from CodeAcademy.我希望这有助于您指出正确的方向.
