HTML5中图片之间的缝隙完美解决方法


Posted in HTML / CSS onJuly 07, 2017

最近做h5的项目,碰到了一个百思不得其解的问题,几个img标签中间有大约3px的空隙

如图:

HTML5中图片之间的缝隙完美解决方法 

后来百度查了一番,大致了解了原因,是因为浏览器把元素当成了字,空隙是给一些对齐字母后仍然长出一截的(例如j,g)预留的。也找到了几种解决方法,亲测可行。

1,把body的font-size 设置成0;
 

这样做的时候要记得下面写div的时候给元素指定字号。

2,把

<img src="assets/img/turntable/lucky-turntable_07.jpg">
    <img src="assets/img/turntable/lucky-turntable_11.png" >
    <img src="assets/img/turntable/lucky-turntable_08.jpg">

写成

<img src="assets/img/turntable/lucky-turntable_07.jpg"><img src="assets/img/turntable/lucky-turntable_11.png"><img src="assets/img/turntable/lucky-turntable_08.jpg">

也就是说,把img标签写在同一行,中间不要有空格;

以上所述是小编给大家介绍的HTML5中图片之间的缝隙完美解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
使用CSS3和Checkbox实现JQuery的一些效果
Aug 03 HTML / CSS
CSS3绘制有活力的链接下划线
Jul 14 HTML / CSS
CSS3实现酷炫的3D旋转透视效果
Nov 21 HTML / CSS
Html5画布_动力节点Java学院整理
Jul 13 HTML / CSS
HTML5之SVG 2D入门1—SVG(可缩放矢量图形)概述
Jan 30 HTML / CSS
检测浏览器是否支持html5视频的代码
Mar 28 HTML / CSS
html5 CSS过度-webkit-transition使用介绍
Jul 02 HTML / CSS
HTML5 History API 实现无刷新跳转
Jan 11 HTML / CSS
使用phonegap播放音频的实现方法
Mar 31 HTML / CSS
使用数据结构给女朋友写个Html5走迷宫游戏
Nov 26 HTML / CSS
CSS3 天气图标动画效果
Apr 06 HTML / CSS
css3实现背景图片颜色修改的多种方式
Apr 13 HTML / CSS
html5是什么_动力节点Java学院整理
Jul 07 #HTML / CSS
html5简单示例_动力节点Java学院整理
Jul 07 #HTML / CSS
html5简介_动力节点Java学院整理
Jul 07 #HTML / CSS
HTML5 文件上传下载的实例代码
Jul 03 #HTML / CSS
浅析HTML5中的 History 模式
Jun 22 #HTML / CSS
常用的HTML5列表标签
Jun 20 #HTML / CSS
HTML5本地存储之IndexedDB
Jun 16 #HTML / CSS
You might like
拼音码表的生成
2006/10/09 PHP
PHP的FTP学习(一)
2006/10/09 PHP
完美解决PHP中文乱码
2009/11/26 PHP
PHP计划任务之关闭浏览器后仍然继续执行的函数
2010/07/22 PHP
PHP批量查询WordPress留言者E-mail地址实现方法
2015/02/15 PHP
Zend Framework基于Command命令行建立ZF项目的方法
2017/02/18 PHP
实例讲解PHP表单处理
2019/02/15 PHP
laravel-admin的多级联动方法
2019/09/30 PHP
PHP高并发和大流量解决方案整理
2019/12/24 PHP
IE与firefox之jquery用法区别
2008/10/03 Javascript
javascript中定义私有方法说明(private method)
2014/01/27 Javascript
原生js仿jq判断当前浏览器是否为ie,精确到ie6~8
2014/08/30 Javascript
更靠谱的H5横竖屏检测方法(js代码)
2016/09/13 Javascript
Angular.JS判断复选框checkbox是否选中并实时显示
2016/11/30 Javascript
详解webpack打包后如何调试的方法步骤
2018/11/07 Javascript
微信小程序按钮点击跳转页面详解
2019/05/06 Javascript
NodeJs crypto加密制作token的实现代码
2019/11/15 NodeJs
vue中watch和computed为什么能监听到数据的改变以及不同之处
2019/12/27 Javascript
浅谈webpack构建工具配置和常用插件总结
2020/05/11 Javascript
js实现表格单列按字母排序
2020/08/12 Javascript
JavaScript判断数据类型有几种方法及区别介绍
2020/09/02 Javascript
vue-cli4.0多环境配置变量与模式详解
2020/12/30 Vue.js
详解vue之自行实现派发与广播(dispatch与broadcast)
2021/01/19 Vue.js
[51:00]Secret vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
python构造icmp echo请求和实现网络探测器功能代码分享
2014/01/10 Python
跟老齐学Python之编写类之一创建实例
2014/10/11 Python
Python 如何访问外围作用域中的变量
2016/09/11 Python
python 五子棋如何获得鼠标点击坐标
2019/11/04 Python
Pytorch maxpool的ceil_mode用法
2020/02/18 Python
pytorch:model.train和model.eval用法及区别详解
2020/02/20 Python
基于selenium及python实现下拉选项定位select
2020/07/22 Python
纯CSS3实现Material Design效果
2017/03/09 HTML / CSS
幼儿园大班毕业教师寄语
2014/04/03 职场文书
小学竞选班干部演讲稿
2014/08/20 职场文书
2014年药房工作总结
2014/11/22 职场文书
Javascript 解构赋值详情
2021/11/17 Javascript