本仓库主要是学习笔记及一些记录，欢迎大家交流！

技术差异选择

HTML

语义标签

无语义标签 优点：不存在兼容性问题，基本浏览器都支持 缺点：不利于搜索引擎，结构不明了

有语义标签 优点：更利于SEO，结构清晰，便于开发 缺点：低版本浏览器兼容问题

CSS

图标显示方式

单张图片 优点：暂无 缺点：多张图需要多次加载，增加服务器负担

精灵图 优点：相较于图片只需要加载一次 缺点：依然是图片，体积较大，高分辨率会模糊

字体图标 优点：体积小，更换颜色，受分辨率影响小 缺点：做动画涉及图片方面不足

排版布局

浮动 优点：相对快速，浏览器兼容性好 缺点：会脱标，不是特别灵活

定位 优点：可以把图片位置控制到准确的位置 缺点：添加相对复杂

flex 优点：快速，灵活 缺点：浏览器兼容性比较差

移动适配

rem

1. 需要不断修改html文字大小
2. 需要媒体查询media
3. 需要 flexible.js

vw/vh 省去各种判断和修改，直接使用