0

編集：これはより理にかなっているかもしれません。この画像を確認してください。http://puu.sh/rt8M 画像はパディングを通過するだけです。画像に対応するために、タイトル div を垂直方向に拡張したい。テキストを中央に配置したまま、画像の中央がテキストのある線と交差する必要があります。

私はimgを左に（そしてテキストの後に別のものを右に）揃えたいと思っています。さまざまなプロパティを試しましたが、どれも正しく機能していないようです。誰でも助けることができますか？

明確にするために、画面またはブラウザウィンドウの左側に画像が必要です。div は、ヘッダー/タイトル div に期待されるように、画面の左から右に伸びます。

Float;left は、img を div タグからドロップアウトするようです。text-align:center; があることに言及する必要があります。タグのプロパティ。しかし、削除しても問題は解決しないので、それが原因かどうかはわかりません。

HTML

<div id="header">
    <div id="title">
    <h1>
    <img class="logo" src="images/logo.png" alt="" width="86" height="98" />
    <a href="index.html">Page Header Title</a>
    </h1>
    </div>
</div>
4

4 に答える 4

0

これを使って

<div id="header" style="float:left">
<div id="title">
<h1>
<img class="logo" src="images/logo.png" width="86" height="98" />
<a href="index.html">Page Header Title</a>
</h1>
</div>

于 2012-04-25T19:35:28.607 に答える
0

CSS：

.logo{
     float:left;
     width: 86px;
     height:98px;
     display:block;    
}

.img2{
    float:right;
    display:block;
}

.clear{
    clear:both;
}

HTML：

<div id="header">
    <div id="title">
        <h1>
            <img class="logo" src="images/logo.png" alt="" />
            <a href="index.html">Page Header Title</a>
            <img class="img2" src="images/img2.png" alt="" />
            <div class="clear"></div>
        </h1>
    </div>
</div>

ロゴがdivから削除される理由は、ロゴがクリアされていないためです。これで問題が解決するはずです。

于 2012-04-25T19:54:30.490 に答える
0

ちょっとしたコードの例を作成しました。これがあなたがやろうとしていることだと思いますか？ http://dabblet.com/gist/2492793

于 2012-04-25T19:48:00.313 に答える