L'espacement par défaut des éléments de bloc en ligne est effacé

Cette fois, je vais vous apporter l'espacement par défaut des éléments de bloc en ligne. Quelles sont les précautions pour effacer l'espacement par défaut des éléments de bloc en ligne. Voici un cas pratique, jetons un coup d'œil. .

Sans plus tard, regardons directement l'exemple de code

nbsp;html>


    <meta>
    <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>


    <h4 id="默认状态">默认状态</h4>
    <p>
        </p><p>盒子1</p>
        <p>盒子2</p>
        <p>盒子3</p>
        <p>盒子4</p>
        <p>盒子5</p>
    
    <h4 id="方法一-letter-spacing-em">方法一         letter-spacing: -0.5em</h4>
    <p>
        </p><p>盒子1</p>
        <p>盒子2</p>
        <p>盒子3</p>
        <p>盒子4</p>
        <p>盒子5</p>
    
    <h4 id="方法二-font-size">方法二        font-size: 0</h4>
    <p>
        </p><p>盒子1</p>
        <p>盒子2</p>
        <p>盒子3</p>
        <p>盒子4</p>
        <p>盒子5</p>
    

Le rendu implémenté est le suivant

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Fixe à gauche, mise en page adaptative à droite

IE avec filtre de transparence d'opacité Solutions compatibles

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!