div与span;图与图之间空隙的清除

div与span:

span: display为inline,不可以设置宽高,只能通过定义padding来设置它的大小.
div: display为block,可以设置宽高。在div中输入一连串中间没的字母,将有一些字母超出div本身的长度,如:

<div style="width: 50px;height: 50px;background: purple">aasdasda</div>

结果如下:

这是因为系统将它理解为一个单词了,只需要在字母中间加个空格即可,如下

<div style="width: 50px;height: 50px;background: purple">1asd asda</div>

结果如下:

图片与图片之间的空隙

例:

<img src="zlycbz.jpg" alt="">
<img src="zlycbz.jpg" alt="">
<img src="zlycbz.jpg" alt="">

图如下:
可以看到,三个图中间都存在空隙

解决方法

1.将<img>之间的空格删除: <img src="zlycbz.jpg" alt=""><img src="zlycbz.jpg" alt=""><img src="zlycbz.jpg" alt="">
2.定义font-size="0"
3.将图片都定义一个往方向浮动

<img src="zlycbz.jpg" alt="" style="float: left;">
<img src="zlycbz.jpg" alt="" style="float: left;">
<img src="zlycbz.jpg" alt="" style="float: left;">