2

プロパティがリンクに継承されているテキストtext-align: justify;や、そのテキスト内の他のネストされたインライン要素があります。たとえば、他のテキスト整列モードをそれらのいくつかに設定したいのですが、text-align: center;できません。Firebugは、親スタイルがオーバーライドされていることを示していますが、ネストされたインライン要素は引き続き正当化されます。私は多くの異なるブラウザで奇妙な振る舞いを観察しました、そして明らかに彼らは仕様によってこれを行っていますか？それは本当に設計によるものですか？それを回避する方法は？

編集：いくつかのサンプルコード。ID = span1のスパンは、独自のテキスト整列を定義できません。右揃えにする必要がありますが、代わりに中央に配置されます。実験していると、インライン要素ではテキストの配置をまったく定義できないことに気付きました。非常に奇妙な。

<html>
<head>
<style type="text/css">
#cubic { width: 495px; height: 200px; background-color: green; text-align: center}
#span1 {text-align: right; color: red}
</style>
</head>

<body>
<p id="cubic">
<span id="span1">This is span 1</span>
</p>
</body>
</html>
4

3 に答える 3

3

正しい; インライン要素は、ブロックを表示するように設定されていない限り、text-align セットを持つことはできません。

簡単な例:

<html>
<style>
    #spanInline {text-align:right;}
    #spanBlock {text-align:right;display:block;}
    #divBlock {text-align:right;}
    #divInline {text-align:right;display:inline;}
</style>
<body>
<span id="spanInline">asdf</span><br />
<span id="spanBlock">asdf</span><br />
<div id="divBlock">asdf</div><br />
<div id="divInline">asdf</div><br />
</body>
</html>

要素の周りに境界線を引くと、これが機能しない理由についての詳細が表示されます。

于 2011-04-03T00:11:06.960 に答える
2

実際には、text-align はブロック要素にのみ適用され、span はブロック要素ではありません。次のコードを試してください。

<p id="cubic">
<div id="span1">This is div 1</div>
</p>

そして、それがあなたのニーズに合っているかどうかを確認してください。

于 2011-04-03T00:12:05.790 に答える