0

私の場合、ネストされたリストを簡略化し、divを囲んでいますが、変更することはできません。drupalメニューによって作成されています。

ハードコードされたサイトのメニューのクローンを作成したい(削除されたリンクを編集)

サブメニューにボックス(ul li ul liアイテム)を「埋め込む」にはどうすればよいですか?ブロック表示のリストだけで可能ですか?それらのz-indexが必要ですか?またはフロート?リストアイテムでもフロートは可能ですか?

一般的に、私はカスケードのことを理解していますが、それでも数回の繰り返しでcssを書くのに一生懸命です。短縮するためのいくつかのヒントがいいでしょう。

今のところ私の主な質問は、最後のエントリ(マークされている)のスタイルが上書きされる理由です。ファイル内の順序は役割を果たしますか?

#block-system-main-menu .content {
    font-size: 17px;
    font-weight: bold;
}

#block-system-main-menu div ul li {
    width: 207px;
    margin: 4px 0px;
}

#block-system-main-menu div ul li {
    display: block;
    height: 38px;
    background: url(/sites/all/themes/schott/menuitembg.gif);
}

#block-system-main-menu div ul li .active-trail {
    display: block;
    height: 60px;
    background: url(/sites/all/themes/schott/menuitembg_p.png);
}

div ul li ul li.leaf {   /* both styles are overwritten */
    display: inline-block;
    background: url(/sites/all/themes/schott/subitem_passive.gif);
}
4

3 に答える 3

5

最後に記述されたCSSルールが使用されますが、カスケードよりも特異性が優先されます。

特異性に関する記事:http://css-tricks.com/specifics-on-css-specificity/

したがって#block-system-main-menu div ul li .active-trail、最も具体的であり、他のルールを上書きします。

于 2011-03-04T16:55:14.653 に答える
2

次のように変更します。

#block-system-main-menu div ul li ul li.leaf {

あなたが何を求めているのか少し混乱していますが、一般的に、2つの同じルールがある場合は、後者が適用されます。ただし、ルールが同一でない場合は、より具体的なルールが優先されます。

編集:申し訳ありませんが、私はあなたがちょうどそれを理解したのを見ることができます

于 2011-03-04T16:52:01.310 に答える
1

はい、CSSの順序は間違いなく役割を果たします。スタイルの後に宣言されたものはすべて、前のスタイルを上書きします。また、ある種のデフォルトのスタイルを上書きしたい場合は、デフォルトのスタイルの後にそれらを含めます(同じファイルに書き込むか、独自のスタイルシートへのメタリンクを行うかは関係ありません)。

于 2011-03-04T16:48:37.943 に答える