1

HTML/CSS の異なる部分で同じ要素に異なるスタイルを適用するにはどうすればよいですか? 以下を試してみましたが、うまくいかないようです。

メニュー

   <div class="menu">
   <ul>
         <li><a href="#"><Link 1</a></li>
         <li><a href="#"><Link 1</a></li>
         <li><a href="#"><Link 1</a></li>
  </ul>
  </div>

ウェブページのどこかに

   <div class="others">
   <ul>
         <li><a href="#"><Link 1</a></li>
         <li><a href="#"><Link 1</a></li>
         <li><a href="#"><Link 1</a></li>
  </ul>
  </div>

CSS

     .menu ul,li{
         color: rgb(242,253,255);   
         list-style: none;
         text-decoration: none;
         font-size: 20px;
         font-family: chaparral pro;
         }

.others ul,li{
         color: rgb(242,253,255);   
         list-style: none;
         text-decoration: none;
         font-size: 10px;
         font-family: chaparral pro;
         }
4

4 に答える 4

5

CSSでは「」と「」を,意味するため、両方のCSS句がすべての li要素に適用されます（最後に定義された句が優先されます）。簡単に試してください：

.menu ul li{
     color: rgb(242,253,255);   
     list-style: none;
     text-decoration: none;
     font-size: 20px;
     font-family: chaparral pro;
     }

.others ul li{
     color: rgb(242,253,255);   
     list-style: none;
     text-decoration: none;
     font-size: 10px;
     font-family: chaparral pro;
     }
于 2012-08-21T06:53:43.913 に答える
1

次のパートで、スタイルを一般化した小さな間違いをしました。li

.others ul,li { ..... }

上記は、ページのul内側.othersと全体に適用されliます。使用するだけ

.others ul, .others li {
   /*.....*/
}
于 2012-08-21T06:55:26.213 に答える
0

私はそれが働いていると思います。

デモを見る

マークアップが正しくありません

<li><a href="#"><Link 1</a></li>
<li><a href="#"><Link 1</a></li>
<li><a href="#"><Link 1</a></li>

代わりに

<li><a href="#">Link 1</a></li>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 1</a></li>

また、次のようにして、li 要素にスタイルを適用してみてください。

.menu ul li

によってではなく

.menu ul,li

于 2012-08-21T06:58:04.810 に答える