web-dev-qa-db-ja.com

画像の「表示:ブロック」の欠点は?

imgをインラインブロック要素からdisplay: block CSSプロパティを使用してブロックオブジェクトに変換することの欠点はありますか?

ほとんどの場合、私はそれらをblock要素にしたいです。私が失っている有用なinlineの側面はありますか? (おそらく私は some が役に立つとは思っていませんか?)

デフォルトですべての画像をblock要素に変換する必要がありますか?仕様に従ってインラインブロック要素であるのはなぜですか?

P.S。ポジショニングとフロートによるレイアウト、および周囲の要素を考慮してこれを求めています。

15
Baumr

ブロックがその後に改行を強制することをよく考えると、それが悪いシナリオは1つだけです。

その横に別のインライン要素(テキスト、別の画像、スパンなど)を配置する予定の場合

15
David Nguyen

欠点が1つあります。親要素に「text-align:center」を適用して画像を水平方向に中央揃えする場合、画像をブロックまたはインラインブロックとして表示することはできません。

1
Dr Fred

プットimg { display: block; }あなたのCSSで、それを忘れてください。何か別のものが必要になる非常にまれな例では、例外を記述します。

1
DR01D

ブロック表示で見つかったハックの1つ:「ブロック」。

私はこの画像と wavesurfer インラインとして欲しかったオーディオウェーブを持っていました。しかし、表示: "ブロック"; wavesurferのjsではそれを許可していませんでした。

私がしたことは、この cdn ファイルをローカルに保存し、表示をインラインに変更したことです。 )絶対への位置は私の問題を解決しました。変更は、波要素が作成された場所で行われることになっています。

これが誰かを助けることを願っています。このような素晴らしいjsを提供してくれたwavesurferの作成者に感謝します。

0
Shachi