Sam Toki » 日志
Web 前端开发 CSS 初学经验随笔

本文仅发表于班固米

----------

1. 不要使用 rem 单位
1.1. Rem 单位在代码中显得不直观；
1.2. 使用 rem 单位可能导致细微错位，在 F12 调试界面中尤为明显；
1.3. Rem 单位相比 px 单位仅有的一个优势，在于它会适应用户的浏览器设定的默认字号，而绝大多数用户根本不会去更改默认字号；
1.4. 若要进行缩放，最普遍的做法是缩放整个网页，而现在的浏览器能够很好地缩放 px 单位。

2. 使用 JPG 图片
2.1. 平时用惯了 PNG 无损图片，导致自己做的网页加载很慢（不过也取决于网络环境）且很耗流量；
2.2. 后来恍然大悟，改用 JPG 图片，虽然画质略微变差了，但总体体验好了很多；
2.3. 杂谈：网速缓慢时可以观察到，PNG 图片是一次性从上到下扫描出来的，而 JPG 图片是先扫描出比较模糊的版本，然后再进行一两次扫描，逐渐变清晰……具体原理我就不懂了。

3. 按钮设计
3.1. 个人偏好的设计是，浅色按钮 hover 时（背景色）变暗，深色按钮 hover 时变亮；
3.2. 文字链接不显示下划线；
3.3. 杂谈：网页中的圆角矩形按钮，鼠标指针刚好在其角落时，不会判定 hover，而 Windows 的按钮会判定——表面上是圆角矩形，实际上还是四四方方。

4. 善用「!important」
4.1. 经常遇到后面的配置与前面的配置发生冲突，前面的配置被覆盖的状况；
4.2. 在前面的配置中加上「!important」便可阻止其被覆盖；
4.3. 这个功能在 hover 伪类与 active 伪类中尤其好用。