HAICARA

imgで埋め込んだ画像の下にできる隙間を無くす方法

imgで埋め込んだ画像の下にできる隙間を無くす方法

imgは初期値がインライン要素として指定されています。

文中に埋め込む場合は特にこれといった支障は出てきませんが、サイトの装飾として用いている場合に想定外の余白が出来てしまい、見栄えに問題が出てくることがあります。

displayを変更して解決

特に指定をしていなければ(CSSには表示されていなくても)初期値は以下のようになっています。

img {
  display: inline;
}

手っ取り早く余白を解消するにはCSSに以下を追記し、displayを変更します。

img {
  display: block;
}
RANKING
プラグインなしでWordPressに人気記事ランキングを実装
KUSANAGIで『All-in-One WP Migration』を使ってエクスポートできない時の対処法
ウィンドウサイズに合わせて要素の高さを変動させる
サーバー維持費もゼロでコスト削減!無料でホームページを作れるサービス
Amazon風のグラフ付きレビュー機能が実装できるプラグイン『Comment Star Rating』
TO TOP