H1タグ内に<span>を追加できますか?


96

H1タグ内でスパンタグを使用するのは適切な方法ですか?

<h1>
    <span class="boardit">Portfolio</span>
</h1>

私はこの方法でそれを書くことができることを知っています...そして私自身のウェブサイトでも以下の構文に従っています。

<h1 class="boardit">
  <span>Portfolio</span>
</h1>

しかし、htmlのよりすっきりした形式を知りたかっただけです。


3
@fireeyed私は彼が正しいこと、つまり私のタグのセマンティクスを追跡したいと思っています。
dpp '23 / 09/23

2
accpetedとしてはいけない、あなたが情報を得た場合は、トンをワンマークの答えに忘れる
Pranayラナ

見出しにスパンを入れると、単語の折り返しに問題が生じます。他の誰かがこれを観察しましたか?
ラファエル

1
スパン内のテキストをラップしてみたことはありますか?そして、ブロック要素にあるテキストを折り返すのはどうですか?@Rafael
ダニエル・スプリンガー

回答:


180

はい、できます。

HTML4はこう言っています

<!ENTITY % heading "H1|H2|H3|H4|H5|H6">
<!--
  There are six levels of headings from H1 (the most important)
  to H6 (the least important).
-->

<!ELEMENT (%heading;)  - - (%inline;)* -- heading -->

そして%inline;

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">

そして、%special;含まれて<span>

現在のHTMLはこれを言っています

コンテンツコンテンツ
フレージングコンテンツ

フレージングコンテンツが含まれてい<span>ます。


1
「HTML5にはこれで言う」からのリンクが壊れています:(
mehulkar

@mehulkarお知らせいただきありがとうございます。今すぐ修正する必要があります。
muが短すぎる

29

はい、できます。h1ブロックの一部をフォーマットするために使用できます。

<h1>Page <span class="highlight">Title</span></h1>

スタイルがh1ブロック全体に適用される場合は、次のようにします。

<h1 class="highlight">Page Title</h1>

1
@dppなぜプレゼンテーション名の使用を避ける必要があるのですか?
nu everest 2014年

3

はい、通常はのspan内部を使用することで問題ありませんh1spanインライン要素であるため、通常は何でも使用できます(その中で要素を許可します!)

そして、時々それを行うための本当により明確な方法はありませんh1

一方、少し醜いので、必要がない場合は実行しないでください。


2

はい、大丈夫ですが、なぜでしょう

   <h1 class="boardit">
      Portfolio
   </h1>

それがあなたがしているすべてのことなら?


1
それだけではありません。要求は、見出しの一部のみをスタイルすることです。
Daniel Springer

1

はい、できます。スパンはインラインで表示されるため、H1のスタイリングに影響を与えることはありません。


0

はい、私たちはヘッダータグと一緒にスパンタグを使用することができ、それに何も問題はありません。実際、これはヘッダータグのスタイル設定、特に特定の単語や文字の色付けに広く使用されています。


0

はい、私たちはヘッダータグと一緒にスパンタグを使用することができ、それに何も問題はありません。実際、これはヘッダータグのスタイル設定、特に特定の単語や文字の色付けに広く使用されています。


-2
<h1 style="display:inline;">Bold text goes here</h1> 
<span style="display:inline;">normal text goes here</span>

上記の行で考える-私のために働いた-display:inline propを使用する


これは質問とどのような関係がありますか?
クエンティン

3
@クエンティン私は彼が見出しをインライン要素にすることを強制することを提案することを意味したと私は信じています。それが実行可能であれば、素晴らしいアイデアです。
Daniel Springer

2
この回答は、直接尋ねられるものではありませんが、問題を解決するため、反対票を投じるべきではありません。ソリューションの+1。
Achala Dissanayake 2017
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.