前端学习第一弹-仿淘宝静态页面

静态页面采坑记录

1. 网页标题小矢量图
   在标签中使用link标签
   <link rel="icon" href="图标地址"
   将图片转化为ico格式，放在项目根目录下引用即可，标签详解：
   https://www.w3cschool.cn/htmltags/tag-link.html

2. 矢量图标的引入
        顶部的导航栏 li 标签中的还会存在一些矢量小图标，直接引入矢量图有些部分是无法实现的，如收藏夹前的小星星，鼠标聚焦会改变颜色，很明显不是一个图片，而是类似于一种文字。
        正是要把它转换为一种特殊的文字来引用，在阿里巴巴矢量图标库中下载相应的图标代码，下载的html文件中提供了三种相应的引用方法。因为是学习，只应用了Unicode方式。Unicode方法和Font class都不支持多色，可支持多色的Symbol方法可能会成为主流方法。

3. 小小小箭头
        淘宝首页顶部导航栏，有的 li 右侧会有一个很小的倒箭头，一开始使用的是缩小矢量图代码相应的font size ，结果没有成功。控制台显示的size就是5px，但没有缩小。设置span标签的宽高，然后overflow：hidden，就截取了箭头下面一丢丢。

   	```
   	#nav-top  span.arrow{
   		mar