4

現代では、ほとんどの人がCSSを使用してスタイリングを実行し、CSSにH2の外観を定義させることを理解しています。

ただし、テキストを<h2>のデフォルトの外観のように見せようとしているが、他のテキストと同じ行に配置しようとしていることを想像してみてください。

HTML4でこれを行うことは可能ですか?

または、CSSを使用してエミュレートすることはできますか?<h2>に直接スタイルを設定していないと仮定します。

4

5 に答える 5

5

デフォルトでは、すべてのHTML見出し(<h1><h5>)は。として表示されblockます。これは、見出しを囲む他の要素がある場合、見出しが別の行にあることを意味します。

display: inline見出しに適用することで、CSSでこれを変更できます。ブロックの動作(たとえば、特定の幅を持つなど)を維持するために必要な場合は、display: inline-block代わりに使用できます。

于 2012-06-01T21:33:58.763 に答える
2

それを試してみてください:

<!DOCTYPE html>
<html>
<body>

<style>
.h2{
   font-size: x-large;
   font-weight: bold;
   display: inline;
}
</style>

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<p class="h2">This is heading 2</p>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

</body>
</html>

また、現在のh2に適用する現在のスタイルを無効にする必要があります。例:色:黒!重要; (定義されている場合)

于 2012-06-01T21:30:20.823 に答える
2

次のCSSを使用して、h2表示をインラインにすることができます。

​h2 { display: inline; }​

デモ

于 2012-06-01T21:30:31.680 に答える
0

問題のテキストにaを使用し<span>て、スパンにh2クラスを追加することができます。

jsfiddleの

.header2{
    font-size: 120%;
}​
于 2012-06-01T21:32:51.333 に答える
0

HTML4でそれを行う方法(これは主に質問の対象でした)は、2セルのテーブルを使用することです。

<table><tr valign=baseline><td><h2>Your heading</h2> <td>Other text</table>

最近、これをお勧めする人はあまりいません。

注:のデフォルトのレンダリング(ブラウザーに依存しますが、同様の行に従う傾向があります)を確実にする唯一の方法は、要素h2に適用される可能性のあるCSSルールの使用を控えることです。h2ただし、おそらくブラウザでのHTMLレンダリングについて説明しているページなどで、それを実現したい特別な理由はわかりません。

于 2012-06-02T05:47:30.700 に答える