很多小白在写页面的时候可能会出现这样的问题,几张图片横排铺在1个div里面,图片之间没有设置任何的间距,结果是,在所有浏览器中,图片之间都存在明显的间隙。
那么如何解决呢,今天慧慧给大家介绍五种方法
方法一:将外层div的font-size设为0;
方法二:使用浮动
方法三:注释法(在俩个图片之间注释一下。不建议使用,但是得知道)
方法四:把俩个图片写在一行,不要换行
方法五:给margin取负值,去掉间距(不推荐)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>lihuihui2016</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
div{
font-size: 0
}
</style>
</head>
<body>
<div>
<img src="../images/hh_02_39.jpg" alt=""><!--
--><img src="../images/hh_02_41.jpg" alt="">
</div>
</body>
</body>
</html>
其实不止图片,所有行内标签(span a)这样使用都会出现类似的问题,解决方案都是一样的,大家快去试试吧