suchen

Heim  >  Artikel  >  Web-Frontend  >  Der Standardabstand von Inline-Block-Elementen wurde gelöscht

Der Standardabstand von Inline-Block-Elementen wurde gelöscht

php中世界最好的语言
php中世界最好的语言Original
2018-03-22 17:40:582364Durchsuche

Dieses Mal werde ich Ihnen den Standardabstand von Inline-Block-Elementen vorstellen. Was sind die Vorsichtsmaßnahmen zum Löschen des Standardabstands von Inline-Block-Elementen? .

Schauen wir uns ohne weitere Umschweife direkt den Beispielcode an

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        .content{
            letter-spacing: -0.5em;
        }
        .content .box{
            letter-spacing: normal;
        }
        .content2{
            font-size: 0;
        }
        .content2 .box{
            font-size: initial;
        }
        .box{
            width: 200px;
            height: 100px;
            background-color: #EEEEEE;
            display: inline-block;
            vertical-align: top;
        }
    </style>
</head>
<body>
    <h4>默认状态</h4>
    <p>
        <p class="box">盒子1</p>
        <p class="box">盒子2</p>
        <p class="box">盒子3</p>
        <p class="box">盒子4</p>
        <p class="box">盒子5</p>
    </p>
    <h4>方法一         letter-spacing: -0.5em</h4>
    <p class="content">
        <p class="box">盒子1</p>
        <p class="box">盒子2</p>
        <p class="box">盒子3</p>
        <p class="box">盒子4</p>
        <p class="box">盒子5</p>
    </p>
    <h4>方法二        font-size: 0</h4>
    <p class="content2">
        <p class="box">盒子1</p>
        <p class="box">盒子2</p>
        <p class="box">盒子3</p>
        <p class="box">盒子4</p>
        <p class="box">盒子5</p>
    </p>
</body>
</html>

Das implementierte Rendering ist wie folgt

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Links fixiert, rechts adaptives Layout

IE mit Opazitäts-Transparenzfilter Kompatible Lösungen

Das obige ist der detaillierte Inhalt vonDer Standardabstand von Inline-Block-Elementen wurde gelöscht. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Verschiedene Arten, CSS zu schreibenNächster Artikel：Verschiedene Arten, CSS zu schreiben

In Verbindung stehende Artikel

Mehr sehen