您好,欢迎来到保捱科技网。
搜索
您的当前位置:首页font-size:0的妙用

font-size:0的妙用

来源:保捱科技网

1.为什么要设置font-size:0

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>12</title>
    <style>
        *{
            margin:0;
            padding:0;
        }
        .content{
            background-color: #ccc;
            margin:20px;
            /*font-size: 0;*/
        }
        .title{
            display: inline-block;
            background-color: #afa;
            width:80px;
            height:80px;
        }
    </style>
</head>
<body>
<div class="content">
    <div class="title"></div>
    <div class="title"></div>
</div>
</body>
</html>

.title类并没有设置任何margin,但是两个div并没有紧紧贴合在一起,这是出于排版的原因两个div之间留下了空白字符,才导致两个div元素之间留有间距

2.消除空白间距

虽然不换行可以暂时解决这一问题,但是肯定有更好的方法。在父类中设置font-size:0就可以完美地解决这个空白间距问题。

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- baoaiwan.cn 版权所有 赣ICP备2024042794号-3

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务