1

h1タグの上にタグを追加すると、不明なスペースがありpます。

ここにフィドルがあります

必要なものは下の画像にあります

ここに画像の説明を入力

を検討した後float:left、実際のページで試してみましたが、それでも問題が発生します

これが新しいコードですfloat:left

フロートをいじる

4

7 に答える 7

1

浮かせて取り除くために使用されますdisplay inline-block;

   p {
        width: 80%;
        vertical-align: top; margin:0 
    }
    h1{
        font-size:14px; 
        margin:0; 
        vertical-align:top;

    }
    .thumb{
    float:left;
        height:100px    
    }

デモ

于 2013-02-26T10:36:07.633 に答える
1

問題：の誤った使用display:inline-block;

解決策display:inline-block;：すべてのオカレンスを削除しvertical-align:top;て与えます.thumb float:left;（ブロック要素を隣り合わせにする正しい方法）。

例： http： //jsfiddle.net/CKRNs/9/

于 2013-02-26T10:36:33.597 に答える
1

thumbこれは、クラス (画像) に 100px の高さを指定したためです。その高さを削除するだけで修正されます。Fiddle を参照してください: http://jsfiddle.net/CKRNs/4/

編集：画像の横にタグが必要だと言ったように、次のようにタグとクラスの両方pに追加します： http://jsfiddle.net/CKRNs/6/float: leftpthumb

于 2013-02-26T10:33:23.030 に答える
0

、、および定義にを追加しfloat:left;ます。ph1.thumb

于 2013-02-26T10:33:46.410 に答える
0

画像を設定する必要がありますfloat:left。このデモを参照してください：http：//jsfiddle.net/CKRNs/14/

于 2013-02-26T10:35:54.997 に答える
0 
.thumb{
    display:inline-block;
    height:100px;
        float:left; 
}

これは、画像が左に浮き、テキストが折り返されることを意味します

于 2013-02-26T10:36:06.570 に答える
0

親指には絶対位置を使用します。h1タグとpタグにmargin-leftをつけます。http://jsfiddle.net/CKRNs/13/

h1, p{
margin: 0 0 0 60px; 
}

.thumb{
  position:absolute;
  width:50px;
  height:50px;
}
于 2013-02-26T10:41:16.793 に答える