7

デフォルトでは、スタイルが設定されていないネストされた<ul>リストのセットは次のようになります(少なくともChrome、Firefox、およびIEでは)。

ネストされた<ul>スクリーンショット

最上位レベルのはlist-style-type、、disc次のレベルはcircle、、後続のレベルはsquareです。

list-style-typeに変更するスタイルシートを含める場合none、ドキュメントの後半で「自動箇条書きタイプ」に戻す簡単な方法はありますか?(たとえば、後続のCSS定義またはJavaScriptスタイルの変更でオーバーライドします)

基本的に、私は次のようなものを探していますlist-style-type: auto;(これは明らかに無効であり、効果はありません):

<style type="text/css">
    ul { list-style-type: none; }
    ul { list-style-type: auto; } /* Does not work */
</style>

list-style-type戻すとdisc、リスト内のすべての箇条書きが変更され、さまざまなレベルでさまざまな箇条書きが表示されなくなるため、これも機能しません。

すべてのレベルのスタイルを明示的に定義することによってこれを達成する唯一の方法はありますか?例えば:

<style type="text/css">
    ul { list-style-type: disc; }
    ul ul { list-style-type: circle; }
    ul ul ul { list-style-type: square; }
</style>
4

3 に答える 3

1

クラスを使用して、次のようなものを記述します。

ul { list-style-type: none; }
.list_default { list-style-type: circle; }

次に、弾丸を適用するulで、

<ul class="list_default">
    <li>one</li>
    <li>two</li>
</ul>

また、「自動」動作を使用しない場合は、他のポスターのアドバイスを参考にしてください。標準およびメーカー定義のデフォルトには非常に多くの独自の拡張機能があり、後で髪を抜くことができます。彼らの正気に依存しないという今の良い習慣を身につけなさい。

于 2012-06-20T05:25:49.727 に答える
0

すべてのレベルのスタイルを明示的に定義することによってこれを達成する唯一の方法はありますか?

うん、ulを使用して、それが唯一の方法です。基本的に、これはまさにクロムが行っていることです。

それでもクロームスタイルを第2レベルから維持したい場合は、第1レベルにulを使用しないでください。divを使用...

于 2012-06-14T00:55:25.890 に答える
0

私は最近、これの必要性に遭遇し(ネストはありませんが、ローマ語とギリシャ語などを暗黙的に設定しない方が望ましい)、inherit成功裏に使用されました。当然、定義されているルールによって効果は異なりますが、私の場合はうまくいきました。

于 2013-07-15T19:25:22.843 に答える