web-dev-qa-db-ja.com

H見出し+同じ行の他のテキスト

同じ行に見出しと重要度の低いテキストを表示しようとしています。

スキル評価

(5段階)

しかし、私は本当に(scale of 5)を同じ行に配置し、ドキュメント構造のセマンティクスのためにSkill Ratings<h>タグでラップすることを望んでいます。

私は不動産に厳しいので、別の行は必要ありません。(scale of 5)はCSSスタイルにリンクされます。

これは可能ですか?そうでない場合は、見出しとしてSkill Ratingsを使用しないことを選択しますが、そうすることをお勧めします。

12
amphibient

HTML

<h1>Skill Ratings <span>(scale of 5)</span></h1>

CSS

h1 span { font-size:16px; }
23
Lowkase

Lowkaseの回答を使用できます。または、何らかの理由で要素を見出しタグと段落タグに分ける必要がある場合は、次のようにすることができます。

<h1>Skill Ratings </h1>

<p>(scale of 5)</p>

それからここにcssがあります:

.h1 { display: inline; }
.p { display: inline; }

Lowkaseのソリューションはよりセマンティックであるため、おそらくより良いソリューションですが、これは別の方法です。

編集

申し訳ありませんが、ヘッダータグに入れたいと思ったので、Lowkaseの回答を使用してください。

9
Mike Legacy

<h1> display:inlineを作成するだけです。このようにして、通常のテキストフローでレンダリングされます。

ここでいじる

<h1>Skill Ratings </h1>(scale of 5)

h1 {
    display:inline
}
0
Milche Patern