1. 
一些容易被忽略的前端细节
举个例子：如上图，正如我们看到的百度网盘前边有个小图标，那么这个小图标是怎么加上去的呢？
在head里写入如下语句即可。
<link rel="shortcut icon" href="图片路径" target="_blank" rel="external nofollow" type="image/x-icon">
2.
想说一些经验，就是在写代码前可以先把结构画画，这样可以帮助我们理清楚思路。然后可以先写HTML，搭好框架后再写样式（应人而异，这里只是建议）
怎么样？是不是做起来会上手快一点？
3.
在这次练习中，我发现了几个问题，可能也是日常中你常忘记的，不如记录一下子。
1.给span没办法加样式的时候，可以给它的父类加
2.用弹性布局的时候，是在它的父模块中使用属性。（我对弹性布局很是模糊，希望大佬们可以在下边评论教教我。）
4.最后附上源码
（PS：我是在vscode里写的）
index.html
<!DOCTYPE html>
<html>
<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="shortcut icon" href="image/man.png" target="_blank" rel="external nofollow" type="image/x-icon">
<link rel="stylesheet" href="index.css" target="_blank" rel="external nofollow" >
</head>
<body>
<nav >
<a href="" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >首页</a>
<a href="" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >登陆</a>
<a href="" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >注册</a>
<a href="" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >大春</a>
<a href="javascript:;" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" >退出</a>
</nav>
<header>
<img src="image/title.png" alt="">
<br />
<button class="yj cj">我要参加</button>
<div>
<input type="text" class="yj">
<button class="yj ss">搜索</button>
</div>
</header>
<main>
<ul>
<li class="dis">
<a href="javascript:;" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" class="dis">
<img src="image/woman.png" class="tx">
<div >
<div >
<span>大春</span>|
<span>编号：001</span>
<p>我喜欢前端</p>
</div>
</div>
</a>
<!-- -->
<div id="spa">
<span >24</span>
<br/>
<button>投她一票</button>
</div>
</li>
<li class="dis">
<a href="javascript:;" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" class="dis">
<img src="image/woman.png" class="tx">
<div >
<div >
<span>小娜</span>|
<span>编号：002</span>
<p>我喜欢后台</p>
</div>
</div>
</a>
<!-- -->
<div id="spa">
<span >22</span>
<br/>
<button>投她一票</button>
</div>
</li>
<li class="dis">
<a href="javascript:;" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" class="dis">
<img src="image/woman.png" class="tx">
<div >
<div >
<span>胖子</span>|
<span>编号：003</span>
<p>我喜欢UI</p>
</div>
</div>
</a>
<!-- -->
<div id="spa">
<span >26</span>
<br/>
<button>投她一票</button>
</div>
</li>
</ul>
</main>
</body>
</html>
index.css
nav{
text-align: right;
background-color:#29B6F6;
}
header{
background-color:#29B6F6;
text-align: center;
}
.cj{
background-color: chocolate;
}
.yj{
border-radius: 10px;
}
.ss{
background-color: #2196F3;
}
.tx{
height: 50px;
width: 50px;
}
.dis{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}
#spa{
text-align: center;
}