ホームページ > ウェブフロントエンド > CSSチュートリアル > li_CSS/HTMLに挿入されたimg画像間のギャップの解決策

li_CSS/HTMLに挿入されたimg画像間のギャップの解決策

WBOY
リリース: 2016-05-16 12:03:35
オリジナル
2730 人が閲覧しました

スタイルを直接追加 img{vertical-align:bottom; display:block}

もちろん、うまくいかない場合もあります。たとえば、上、中、下の 3 つの写真を追加したいのですが、真ん中の写真が背景として設定されています。この方法は無効であることがわかりました。上の写真と真ん中の写真の間の隙間がなくなっていること、そして下の写真と真ん中の写真の間の隙間がなくなっていることです。まだ間に何かがあります。方法は非常に簡単です。vertical-align:bottomをtopに変更します。垂直方向のパラメータを設定できます。」 - 遭遇するさまざまな状況に応じて調整してください。

方法 1:

コードをコピー コードは次のとおりです。

img{vertical-align:top;表示:ブロック }

li_CSS/HTMLに挿入されたimg画像間のギャップの解決策

コードをコピー コードは次のとおりです。


方法 2: コンテナーの font-size:0 を設定します (個人的には、この方法が最良だと思います!!!)

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート