web-dev-qa-db-ja.com

デフォルトのリストスタイリング（CSS）とは何ですか？

私のウェブサイトでは、reset.cssを使用しています。リストスタイルにこれを正確に追加します。

ol, ul {
    list-style: none outside none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    font-size: 100%;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
}

問題は、すべてのリストスタイルがNONEに設定されていることです。ウェブサイトのサブページのすべてのリストのみ（.my_containerのすべてのリスト）の元のリストスタイル（デフォルト）に戻したい。

list-style-typeからinheritのような設定を試みると、このCSSプロパティのためだけにブラウザのデフォルトスタイルを継承しません。

reset.cssを変更せずに、特定のプロパティの元のブラウザーのスタイルを継承する方法はありますか？

htmlcsshtml-lists
82
Atadj

リセットを削除するためにこのCSSを設定していました。

ul { 
   list-style-type: disc; 
   list-style-position: inside; 
}
ol { 
   list-style-type: decimal; 
   list-style-position: inside; 
}
ul ul, ol ul { 
   list-style-type: circle; 
   list-style-position: inside; 
   margin-left: 15px; 
}
ol ol, ul ol { 
   list-style-type: lower-latin; 
   list-style-position: inside; 
   margin-left: 15px; 
}

編集：もちろん特定のクラスで...

129
zessx

これは実際にあなたが探しているものだと思います：

.my_container ul
{
    list-style: initial;
    margin: initial;
    padding: 0 0 0 40px;
}

.my_container li
{
    display: list-item;
}
31
ColdCold

ドキュメントによると、ほとんどのブラウザは<ul>、<ol>および<li>要素を次のデフォルト値で表示します：

UL または OL tag：のデフォルトのCSS設定

ul, ol { 
    display: block;
    list-style: disc outside none;
    margin: 1em 0;
    padding: 0 0 0 40px;
}
ol { 
    list-style-type: decimal;
}

LI tag：のデフォルトのCSS設定

li { 
    display: list-item;
}

スタイルのネストされたリスト項目：

ul ul, ol ul {
    list-style-type: circle;
    margin-left: 15px; 
}
ol ol, ul ol { 
    list-style-type: lower-latin;
    margin-left: 15px; 
}

注：上記のスタイルをクラスで使用すると、結果は完璧になります。異なる List-Item マーカーも参照してください。

10
Reza Mamun

http://www.w3schools.com/tags/tag_ul.asp

ul { 
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}
9
jerrygarciuh

できません。要素にプロパティを割り当てるスタイルシートが適用されているときはいつでも、要素のインスタンスについて、ブラウザのデフォルトに到達する方法はありません。

Reset.cssの（議論の余地のある）アイデアは、ブラウザーのデフォルトを削除することです。これにより、クリーンなデスクから独自のスタイリングを開始できます。 reset.cssのバージョンはこれを完全には行いませんが、その程度まで、reset.cssを使用する作成者は完全レンダリングを定義することになっています。

4
Jukka K. Korpela

2番目のcssブロックのすべての要素のマージンをリセットしています。デフォルトのマージンは40pxです-これは問題を解決するはずです：

.my_container ul {list-style:disc outside none; margin-left:40px;}
2
OmidAntiLong

将来の答え：CSS 4には、おそらく、ユーザーまたはユーザーエージェントスタイルシート[ source ]の値にプロパティを戻す、revertキーワードが含まれるでしょう。これを書いている時点では、Safariのみがこれをサポートしています。- ここをチェック ブラウザサポートの更新について。

あなたの場合、次を使用します：

.my_container ol, .my_container ul {
    list-style: revert;
}

this other answer も参照してください。

0
tanius