ホームページ > ウェブフロントエンド > htmlチュートリアル > inline-blockattribute_html/css_WEB-ITnoseによるタグ間のギャップ問題を解決

inline-blockattribute_html/css_WEB-ITnoseによるタグ間のギャップ問題を解決

WBOY
リリース: 2016-06-24 11:22:11
オリジナル
1257 人が閲覧しました

1. inline-block 要素の親要素を設定します。

親要素のfont-size: 0;を設定します。子要素の font-size を適切なサイズに設定します。子要素の font-size が設定されていない場合、子要素は親要素の 0 を継承します。

2 の親要素を設定します。 -block要素。 (letter-spacing: 文字間隔)

親要素のletter-spacingを-4pxまたは-8pxに設定します。Googleは-8pxですが、残りは-4pxです。また、子要素の文字間隔を 0 に設定します。それ以外の場合、親要素が継承され、子要素内のテキストが変形します。

テスト後、-8pxに設定しました。これが可能かどうかはわかりません。ご意見があれば、お気軽にお知らせください。

3. inline-block要素の親要素を設定します。 (word-spacing: 単語間隔)

親要素の word-spacing を -4px または -8px に設定します。Google、360 は -8px、Firefox、IE は -4px です。また、子要素の word-spacing: 0 を設定します。それ以外の場合、親要素が継承され、子要素内のテキストが変形します。

上記と同じように-8pxに設定することもできます

4. Google、Firefox、360での上記のテストはすべて最新のブラウザIE8でテストされました。何か問題がございましたらお知らせください。

参考: http://www.21shipin.com/html/98779.shtml

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