CSS 行内、行内块元素空白间隙解决方案

本文探讨了CSS中行内块元素如img图片和行内元素如span、i出现空白间隙的问题。针对img图片间隙,可以通过将图片放入div并设置font-size为0来解决;对于行内元素的空白,可以设置body的font-size为0px来消除空白。
摘要由CSDN通过智能技术生成

1. 行内块元素 img 图片空白

代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        img {
    
            width: 200px;
        }
    </style>
</head>
<body>
    <img src="./img/杨幂.jfif" alt="">
    <img src="./img/杨幂.jfif" alt="">
    <img src="./img/杨幂.jfif" alt="">
</body>
</html>

显示:

在这里插入图片描述
处理办法:

两张图片中间的空白,可以用div把两张图片放在一起,设置style为font-size=0.

代码如下:

<!DOCTYPE html>
<html lang
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值