html部分:(html部分很简单就是无序列表包裹。主要的样式在css里实现特效)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css实现光圈发光动画特效</title>
<link rel="stylesheet" href="css/meiriyijiang.css">
</head>
<body>
<ul >
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
css部分:边缘部分通过不规则的圆形叠加得到。颜色混合样式,延时得到不重合覆盖动态效果。
* {
margin: 0;
padding: 0;
}
//公共样式