line-blockの使い方と最小幅の設定_交換体験

オンラインでの正式な説明:
参照内容
この値により、要素はブロック ボックス モデル (ブロック ボックス) を生成し、それ自体は、置換された要素と同様に、単一のインライン ボックス モデル (インライン ボックス) として流れます。 Display 値が inline-block である要素は、内部的にブロック ボックス モデルを形成し、それ自体がインライン置換要素のように形成されます。
PS: 残念ながら、IE はこれをサポートしておらず、FF もサポートしていません。ほほう~

IE の解決策: 要素がラインブロックのような特性を持つように IE のレイアウトをトリガーします。

FF ソリューション: moz 固有の属性を使用する: display::-moz-inline-box;

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="keywords" content="PRcss,xhtml,html,css,js,本,個人のホームページ,退屈,緊張,怠け者"> <meta name="description" content="PRcss の個人ホームページ、退屈、緊張、怠惰..."> <meta name="作成者" content="PRcss,qq:50198763"> <meta name="Copyright" content="このページの著作権は PRcss に属します。無断複写・転載を禁じます"> <title>ラインブロックの使用: 最小幅の設定 - www.jb51.net</title> <style type="text/css"><!-- .box { 表示:インライン; ズーム:1; 最小幅:400px; 幅:自動!重要; 幅:400px; クリア:右; ボーダー:1px ソリッド #000; 背景:#ccc; } html:lang(zh-CN) .box { 表示:-moz-inline-box; } .box img { 表示:ブロック; 幅:100px; 高さ:300px; 背景:#c00; } --></style> <p class="box"> <img src="pr.jpg" alt="line-blockの使い方と最小幅の設定_交換体験" ></p> <p>テスト</p>