0

私は最近、ボックスをコーディングしようとしました。左側に画像があり、その横にヘッダーと段落が右側に次のように含まれています。

http://gyazo.com/c5165fa45c32f69499768ba95d815328

これは私がやったことです：

       <div class="span4">
        <div class="box">
            <img src="img/share.png" class="image_margin"/>
                <span class="box_title">SHARE</span>
                <span id="texting">Upload files straight from you hard disc. Up to 600MB per file upload! the more you earn the more file storage you get.</span>
        </div>
        </div>

CSS:

.box {
    background-image: url("../img/box.png");
    width: 305px;
    height: 117px;
}
#texting {
font-size: 14px;
}

.image_margin{
    margin-top: 25px;
    margin-left: 25px;
}
.box_title{
    font-size: 24px;
    color: #8d8d8d;
    margin-left: 15px;
    margin-top: 20px;
    position: absolute;
}

結果は次のとおりです。

http://gyazo.com/f600c42f86b51e52de436631fc96656d

テキストがボックスから出て、ボックスのクラスの中にあるのはなぜですか? 私は何を間違えましたか？すべての画面に収まるように、CSS の最初の画像のようにタイトルと段落を揃えるにはどうすればよいですか?

本当にありがとうございました！

4

1 に答える 1

0

タグで使用align="left"します。img

<img src="img/share.png" class="image_margin" align="left"/>

これが役立つことを願っています

于 2012-10-02T01:04:47.367 に答える