25

次のようにH1タグを閉じた後、Pタグ内にテキストを配置しようとしています。

見出しそしてここに直後のテキストがあります...

しかし、私はそれを機能させることができません。このCSSを作成しましたが、何かが足りないのではないでしょうか。

CSS：

p.start {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 28px;
    text-align: justify;
    display: inline;
}

h1.start {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 28px;
    margin: 0;
    display: inline-block;
}

HTML：

<div id="containerIntro">
    <h1 class="start">Headline </h1>
    <p class="start">Text......</p>
</div>
4

6 に答える 6

34

だからあなたが持っていた場合：

<div id="containerIntro">
    <h1>Headline</h1>
    <p>And here the text right after...</p>
</div>

CSSは次のようになっている必要があります。

#containerIntro h1,
#containerIntro p {
    display: inline;
    vertical-align: top;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 28px;
}

http://jsfiddle.net/F3Bcd/3/を参照してください。

于 2012-04-25T16:14:49.617 に答える
6

<p>要素と要素は両方とも<h1>ブロック レベルです。つまり、コンテナーの幅全体を占有します。両方の要素を左に浮かせてみてください。これにより、それらが左側に積み重ねられ、インライン要素に変換されます。

于 2012-04-25T16:11:49.277 に答える
0

必要な属性と値を使用して CSS で新しいタグを作成するか、既存のタグ (例: .address) を編集します。次に、インラインにしたいテキストをそのタグの下に置きます。それだけです。

その後、コードは次のようになります。

containerIntro h1,

containerIntro address //(in our case) 

{display: inline;}
于 2013-12-20T00:44:59.633 に答える
0

HTML も表示できると、より簡単になります。私はちょうど今推測しています。

h1.start {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 28px;
margin: 0;
display: inline-block;
width: 200px;
}
于 2012-04-25T16:12:22.450 に答える
0

CSS を次のように変更します。

p.start {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 28px;
text-align: justify;
width: 200px;
float: left;
}

h1.start {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 28px;
margin: 0;
width: 200px;
float: left;
}
于 2012-04-25T16:35:43.187 に答える