3

すべてのヘッダーにフォーマットを適用したい。

だから、私は追加しました

 .myformat h1, h2, h3, h4, h5, h6  {  margin-bottom : 1em; ... }

そのように書かれているため、最初のhx. ルールは h1 には適用されません。

のように書くと

 .myformat h1, h2, h3, h4, h5, h6, h1  {  margin-bottom : 1em; ... }

すべて順調。ルールは h1、h2、...、h6 に適用されます。

怪しい… どこか他に問題があると思いますが、見えません。

複数のセレクターにルールを適用するのは正しい方法ですか?

ウィンドウ上のIE9とChrome20で同じ動作をします。Fedora15 上の Firefox12 でも複製されます

編集

みたいなことができるようになりたい

<h1 class="myformat">This text will be red and 
                     or all hx where I apply "myformat"
</h1>
<p class="myformat">This text will be yellow only
                    when myformat is applied on a paragraph
</p>

.myformat h1, h2, h3, h4, h5, h6 { margin-bottom : 1em; ... }この「myformat」はヘッダーにのみ適用されると信じて作成しました。

作成.myformat p { margin-bottom : 3em; ... }
中だったのにブロックした<h1 class="myformat">text</h1>

4

3 に答える 3

6

この .myformat h1、.myformat h2、.myformat h3 などのように試してください。

これは、h1 の h2 の h3 がすべて .myformat という div にあると仮定しています。

ここで確認できます：http://jsfiddle.net/fYgdA/5/

于 2012-07-31T00:04:38.857 に答える
3

正しい構文を使用しています。あなたが抱えている問題はおそらくセレクターに関係しています.myformat h1。HTMLコードを確認してください。そのセレクターはh1、 class を持つ要素内にあるのみを見つけますmyformat。例えば：

<div class='myformat'>
   <h1>Header One</h1>
</div>

myformatがオンの場合はh1、セレクターを使用する必要がありますh1.myformat。そのセレクターは、html が次のような場合に機能します。

<h1 class='myformat'>Header One</h1>
于 2012-07-31T00:02:06.003 に答える
2

.myformat{margin-bottom:1em;}マークアップが以下のサンプルに似ている場合は、ルールを 1 つにするのが適切です。これはセレクターの特異性のために機能し、myformatクラスを持つすべての要素に適用されます。

<h1 class="myformat">Header</h1>
<h2 class="myformat">Subheader</h2>
...

この同じクラスでヘッダーと段落を別々にスタイルしたい場合、2 つのオプションがあります。myformat次のような冗長な（過剰修飾された）セレクターを使用できます

h1.myformat, h2.myformat, h3.myformat {/*some style*/}
p.myformat {/*some other style*/}

または、別のクラス名をオプトインすることもできます。これが望ましいです。

.myformat-title {/*some styles to apply to headers*/}
.myformat-content {/*some styles to apply to paragraphs*/}

あなたが「.myformat p...しかし、私は をブロックしました<h1 class="myformat">text</h1>」と言うとき、正確にはどういう意味ですか? 最終結果が予想と異なる場合は、マージンの崩壊が発生している可能性があります。

于 2012-07-31T01:49:12.387 に答える