2

textnodes を直接の子として含む body elemnt がありますが、patragraphs もあります。ここで、このテキストノードが特定の css 設定を取得できるように css を作成したいと思います。一方、階層のより深いところにあるテキストノード (つまり、段落の 1 つの子) のスタイルを設定したくありません。

直接の子ではないテキストノードをスタイリングせずに、ボディ要素の直接の子であるこのテキストノードをスタイルするにはどうすればよいですか?

4

4 に答える 4

3

知る限り（質問を誤解していない場合）、できません-段落または他の子要素のスタイルをオーバーライドする必要があります。私はこのようにします：

/* for direct text-nodes */
body{
  color: red; 
}

/* maybe its possible to use "body *" here,
   wich sounds like what you need, but i've
   never tested this
*/
body p{ 
  color: black; /* "default" value here*/
}
于 2011-01-21T10:18:12.530 に答える
1

では、次のように定義するのはどうでしょうか:

と

body { /* テキストノードのスタイルをここに */ }

例えば

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<style type="text/css">

body {color:red}

body * {
color:blue;
}
</style>
</head>

<body>
sdfsdfsd
<ul>sdfs
  <li>Coffee <i>- black hot drink</i></li>
  <li>Coca Cola <i>- black cold drink</i></li>
</ul>
jdtzje<div>some div content</div>
<ul>
  <li>Coffee <i>- black hot drink</i></li>
  <li>Coca Cola <i>- black cold drink</i></li>
</ul>fdsfs
<p><b>Note:</b> For :first-child to work in IE, a DOCTYPE must be declared.</p>
</body>
</html>
于 2011-01-21T10:59:28.670 に答える
1

私の知る限り、テキストノードを直接ターゲットにする方法はありません。

BODY のテキスト ノード スタイルを設定してから、P にさまざまなスタイルを適用できます。

または、テキストノードを SPAN に配置して、スタイルを設定することもできます。

于 2011-01-21T10:14:05.033 に答える
-2

このチュートリアルを確認してください: http://www.w3schools.com/css/tryit.asp?filename=trycss_first-child5

編集：ここに例があります

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<style type="text/css">
li>i:first-child
{
color:red;
} 
</style>
</head>

<body>
<ul>
  <li>Coffee <i>- black hot drink</i></li>
  <li>Coca Cola <i>- black cold drink</i></li>
  <li>Test <p>- some text here that's not affected!</p></li>
</ul>
<ul>
  <li>Coffee <i>- black hot drink</i></li>
  <li>Coca Cola <i>- black cold drink</i></li>
</ul>
<p><b>Note:</b> For :first-child to work in IE, a DOCTYPE must be declared.</p>
</body>
</html>
于 2011-01-21T10:05:20.663 に答える