伪选择器：hover
行级元素（内联元素）
feature：1.内容决定所站位置
2.不可以通过css改变宽高
代码：display：inline
代表元素：span strong em a del
块级元素
feature：1.独占一行
2.可以通过css改变宽高
代码：display：block
代表元素：div p ul li ol form address
行级块元素
feature：1.内容决定所站位置
2.可以通过css改变宽高
代码：display：inline-block
代表元素：img
开发中的小问题：
四张图片一行排列，中间会有空隙4px
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
img{
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div>
<img src="a.png" alt="">
<img src="a.png" alt="">
<img src="a.png" alt="">
<img src="a.png" alt="">
</div>
</body>
</html>
触发问题原因：凡带有 inline的 元素都有文字特性-4px的间隙
解决办法：去掉每个< img / >间的空格，不换行，排成一行
<img src="a.png" alt=""><img src="a.png" alt=""><img src="a.png" alt=""><img src="a.png" alt="">