HTML と CSS を使用して画像をテキストで囲むにはどうすればよいですか?

HTML/CSS を使用して画像の周囲にテキストを折り返す

質問:

デザインできますか次のように画像を囲むテキストのブロック:

[画像画像を囲むテキスト]

答え:

はい、画像をフローティングすることで可能ですコンテナ。

HTML:

<div>

CSS:

#container{
    width: 400px;
    background: yellow;
}
#floated{
    float: left;
    width: 150px;
    background: red;
}

説明:

• #container divテキストと画像の境界を定義します。
• #floated div には、画像を囲むテキストが含まれます。
• #floated div の float: left プロパティにより、画像がフローティングになります。
• #floated div の width プロパティは、テキストの幅を定義します。

実際の例:

[JSFiddle](http://jsfiddle.net/kYDgL/)

以上がHTML と CSS を使用して画像をテキストで囲むにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。