2

list-styleとまたはの両方<ul>でCSSをオーバーライドする正当な理由はあります<li>か<li>？

4

6 に答える 6

3

w3.orgごとに、を使用list-style-typeして任意の要素に定義できますdisplay:list-item。

私の知る限り、最近のブラウザでは、任意の要素をに設定して、必要に応じて、それらのいずれかでプロパティをdisplay: list-item正しく使用できるようにすることができます。list-style-type

例：

<!DOCTYPE html>
<html lang="en">
<head>
    <title>12084892</title>
    <meta charset="utf-8">
    <style>
        div span {
            display:list-item; 
            list-style-type: disc; 
            list-style-position: inside;
        }
    </style>
</head>
<body>
<div>
<span>One</span>
<span>Two</span>
</div>
</body>
</html>

雑学クイズはさておき、あなたはどのような行動をとろうとしていますか？同じリスト内の異なるリストアイテムに異なる箇条書きを付けたい場合は、それ自体list-style-typeでを定義する必要があります。与えられた内のすべてのsに同じ弾丸を持たliせたい場合、それはあなた次第です。ただし、これは通常、で定義します。個人的には、そのようにする方が直感的です。liulul

于 2012-08-23T05:05:16.013 に答える
2

CSS仕様を見ると、プロパティが「要素をdisplay: list-item」でスタイル設定することを目的としていることがわかります。

要素で明示的に定義されていない場合、プロパティは継承される<li>ため、要素のみにスタイルを適用することに固執する必要があります<li>。

于 2012-08-23T04:51:05.270 に答える
0

リストスタイルがUL/OLから継承されている場合でも、csslist-styleをliのみに定義する必要があります。また、1つのリストで互いに異なるリストスタイルを作成できます。例えば：

ul.test li {
list-style:disc;
margin:0 0 0 20px;
}
​ul li:first-child {
list-style:circle;
}​
于 2012-08-23T05:11:26.813 に答える
0

同じものなら、違います。都合の良いものに定義するだけです。sは、明示的にオーバーライドされない限り、 '<li>を継承します。<ul>list-style

于 2012-08-23T04:49:20.060 に答える
0

継承は、要素から要素に' list-style'値を転送します。olulli

だから私はあなたがli要素だけにスタイルを適用するべきだと思います。

于 2012-08-23T04:56:10.037 に答える
0

カスケードルールによって引き起こされる予期しない望ましくない問題を回避するため、通常は要素のみを設定する必要がlist-styleありulます。CSS2.1仕様の`list-styleの説明をol参照してください。

たとえば、ol li { list-style: upper-roman; }安全に見えるかもしれませんが、これを考慮してください：

<ol>
  <li>foo
  <ul>
    <li>bar
  </ul>
</ol>

liこれで、「bar」コンテンツを含む内部要素には、セレクターと一致するため、リストスタイルが適用されol liます。（セレクターを使用するol > liとこれを回避できることは事実ですが、ブラウザーの互換性の問題があります。）

代わりに設定すると、内部が一致せず、親から継承されるol { list-style: upper-roman; }ため、問題が回避されます（ブラウザのデフォルトスタイルシートに適切な設定があります）。lilist-styleul

ただし、特定のリストアイテムのスタイルを同じリスト内の他のアイテムとは異なるものlist-typeにする場合は、に直接設定する必要があります。liこのような場合、通常は、内部li要素ではなく、その特定の要素のみに一致するidセレクターまたはその他のセレクターを使用します。

于 2012-08-23T06:09:03.537 に答える