0

画像と2つのテキストを隣り合わせに配置したい。最初のテキストは左端にあります。画像は真ん中にあります。最後のテキストは右端にあります。これが私が現在持っているものです...

<body>

<h2><font color="#99CC00"><font face="Verdana">MrEpicGaming4U</font></h2>
<img src="website_art.png" height= "75" width= "235"/>
<h2><font color="#99CC00"><font face="Verdana">The Art of Gaming</font></h2>

</body>

これどうやってするの？

ありがとう

4

4 に答える 4

6

HTML コードの適切な場所でフォント要素を閉じていません。

また、外部ファイルにスタイルを含めることをお勧めします (CSS について説明します)。

これを変更します：

<body>
    <div class="container">
        <h2>MrEpicGaming4U</h2>
        <img src="Your url" height="75" width="235"/>
        <h2>The art of gaming</h2>
    </div>
</body>

これらの CSS ルールを入力します。

h2 {
    font-family: "Verdana";
    color: #9C0;
}

.container > * {
    display: inline-block;
}
于 2013-06-20T17:46:08.407 に答える
1

最後のアイテムにフロートを追加する必要はありません...

<h2 style="float:left"><font color="#99CC00"><font face="Verdana">MrEpicGaming4U</font></h2>
<img  style="float:left" src="website_art.png" height= "75" width= "235"/>
<h2 style="float:left"><font color="#99CC00"><font face="Verdana">The Art of Gaming</font></h2>

...しかし、完了したらそれらをクリアする必要があります。

<hr style="clear:both";>
于 2013-06-20T17:47:59.593 に答える
0

インラインブロック:

h2, img{display: inline-block;}

float:left に固執している場合は、コンテナー div をoverflow: hiddenで作成するだけです ... clear:both余分な divを追加する必要はありません...

以下に両方の例を示します。

http://jsfiddle.net/Riskbreaker/kAVQ3/2/

于 2013-06-20T17:45:54.143 に答える
0 
   <h2 style="float:left;"><font color="#99CC00"><font face="Verdana">MrEpicGaming4U</font></h2>
   <div style="float:left;"><img src="website_art.png" height= "75" width= "235"/></div>
   <h2 style="float:right;"><font color="#99CC00"><font face="Verdana">The Art of Gaming</font></h2>
   <div style="clear:both;"></div>
于 2013-06-20T17:42:38.723 に答える