<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>鼠标悬停图片时，实现抖动效果</title>
<link rel="stylesheet" href="16.css">
</head>
<body>
<ul>
<li>
<img src="./img/shengdanshu-001.jpg"/>
<p >
景色不错！djfdfj jjgfisdj gsdj sjidgj s sdgj sdgjg sgjsg sgjs
</p>
</li>
<li>
<img src="./img/donggong_bowuguan-002.jpg"/>
<p>房子不错！</p>
</li>
</body>
</html>
/*鼠标悬停时，让li向右上方偏移2px，从而实现抖动的效果*/
/*伪类选择器,hover 当鼠标悬停至元素上方时，向该元素添加样式；*/
li:hover{
position:relative;/*意思是指要相对定位了*/
left: 200px;
top: -200px;
}