文章详情页
li中插入img图片间有空隙的解决方案
浏览:473日期:2022-06-02 14:03:34
直接加样式img{vertical-align:bottom; display:block}
当然在某些情况下无效,比如我要加三个图片,上中下,中间的图片是设为背景,发现用此方法无效,只是上和中的图片空隙没了,而下与中之间还存在,方法很简单,把vertical-align:bottom改成top,可根据自己遇到的不同情况来设vertical-align的参数
方法一:
复制代码 代码如下:
img{vertical-align:top; display:block}

复制代码 代码如下:
<style>
#l1 {float:left;background:#000;}
#l1 ul li {list-style:none;padding:0;margin:0}
img {vertical-align:bottom; display:block;}
</style>
方法二:设置容器font-size:0(个人认为这种方法最好!!!)
相关文章:
1. 命令行CLI一键生成各种烦人的lint配置实例2. Intellij IDEA 2020.3 配置教程详解3. Django serializer优化类视图的实现示例4. $.ajax中contentType: “application/json” 的用法详解5. 关于HTML5的img标签6. 网页中img图片使用css实现等比例自动缩放不变形(代码已测试)7. Spring Cloud Alibaba Nacos Config配置中心实现8. 浅谈IOS屏幕刷新ADisplayLink9. CSS linear-gradient属性案例详解10. CSS代码检查工具stylelint的使用方法详解
排行榜

网公网安备