0

ここはトリッキーです。

どちらもアンカーを含むページに 2 つの UL のスタイルを設定しています。

各 UL には、独自の特定の ID と特定のスタイルがあり、すべて正しいものです。

ここに紛らわしい部分があります-私がこれを持っているとしましょう：

#nav {
    margin: 20px 0 0 0;
  }
    #nav li {
      float: left;

    }
      #nav li a {
        display: block;
        text-transform: uppercase;
        color: #555454;
        font-size: 14px;
        padding: 11px 17px;

      }

そして、これ：

#gt-list 
    {
        margin: 10px 0 0 0;
    }
        #gt-list li, a
        {
            color: #fff;
            margin: 0 0 10px 0;
        }
            #gt-list li a:hover 
            {
                color: #ff6b00;
            }
        #gt-list li img 
        {
            float: left;
            margin: 0 15px 0 0;
            width: 20px;
        }
        #gt-list li span
        {
            float: left;
            display: inline-block;
            margin: 2px 0 0 0;

        }

使用する HTML は次のとおりです。

<ul id="nav">
                    <li class="selected">
                        <a href="#">
                            Home
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            About us
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Ways to give
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Our Work
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            News
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Learn
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Contact Us
                        </a>
                    </li>
                </ul>

上記は、サイトで使用される実際のスタイリングです。

ここに私の問題があります: #nav は #gt-list から LI スタイリングをアンカー スタイリングと共に取得しています。

すべての親 div ID を各 UL に挿入しましたが、影響はありませんでした。

これが分からない!?!?

4

2 に答える 2

3

このルールにはコンマが含まれています。つまりli、その ID を持つ要素の下にあるすべての要素と、それらがどこにあるかに関係なく、すべてのアンカー要素に適用されます。

    #gt-list li, a
于 2012-08-12T23:32:37.677 に答える
1

犯人は次のとおりです。

#gt-list li, a
    {
        color: #fff;
        margin: 0 0 10px 0;
    }

liとの間のカンマは、 #gt-list 内のすべて AND すべて を示すaため、指定されたスタイルが にaグローバルに適用されます。 読みたいのは次のとおりですが、#gt-list内のすべてのAND
lia

lia

に変更します

#gt-list li a
    {
        color: #fff;
        margin: 0 0 10px 0;
    }
于 2012-08-12T23:32:22.747 に答える