30

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>

私はそれをこのように見せようとしています：

ここに画像の説明を入力してください

4

2 に答える 2

29

最初のCSSセレクター（<code> social.h2）は、「h2」クラスの「social」要素を探しています。例：

<social class="h2">

クラスセレクターはドット（.）で始まります。また、スペース（）を使用して、ある要素が別の要素の内側にあることを示します。<h2>クラス内の要素の子孫を見つけるには、次のsocialようにしてみてください。

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

CSSセレクターと、それらがHTMLを参照するためにどのように使用されるかをよりよく理解するために、CodeAcademyのインタラクティブなHTMLおよびCSSチュートリアルを実行することをお勧めします。これがあなたを正しい方向に向けるのに役立つことを願っています。

于 2012-10-21T16:22:15.327 に答える
6

リンクを行うには、次のことができます

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

ホバー、訪問済み、アクティブリンクのスタイルも変更できます。「リンク」をスタイリングしたいものに置き換えるだけです。詳細については、w3schoolsページのCSSリンクをご覧ください。

于 2012-10-21T16:54:21.920 に答える