css改为以rem为单位后网站的体验更好
大家好我是图恩，前两天更新了网站的样式显示单位，首页跟文章详情页面都改成了以rem为单位，改单位原因是因为网站在手机上看上去字体相对较小，至少在ios跟macos上系统是比较小的，标题跟文章字体大小都比正常看起来要小一些，用外接显示器可能差异会小一些。
但是用原生的屏幕看感觉就会明显一些，为了体验更好一些就稍微改动了一下，花的时间并不多。
熟悉开发的朋友可能会知道rem是一个相对根元素的单位，也就是说只需要在设置网页的body/html元素的font-size大小后，再具体给其他元素设置以这个大小为基准的大小即可。
比如我设置body的font-size为16px，那个此时如果我需要设置一个div的宽度为16px，那个我只需要写成1rem即可，这个单位对字体大小也生效，所以常常用在一些移动端的适配上效果会好一些。
修改完成后在手机跟电脑上看了一下效果显示终于正常，一个小小的优化可能就会带来更好的体验，每次进步一点点。
今天还在个人博客上看到一个暗黑模式的设置方法，虽然越来越多的网页跟app都适配了暗黑模式，但是感觉在平常见到的网页里面还是比较少。
其实主要还是适用场景较少，一个网站要适配另一风格，需要适配各种场景，文字、图片、背景等等都需要考虑适配，如果考虑不全面有遗漏的情况下，有可能就是文字跟背景颜色不匹配导致看不清。
适配的问题最主要的还是一个成本的问题，一个网站要实现这个模式，从成本上就需要投入不小的开支，而且投入后并不能看到直接的效果，毕竟有这个需求的人仅仅是一小部分，投入产出不成正比，而且即使不适配也不会影响用户正常的访问，可能这就是大部分的网站并没有及时跟进这个功能吧，当然对于新的网站跟app来说没有这个包袱可以及时跟进，对于想我这样的小网站来说就没有什么必要了。
发表评论 (审核通过后显示评论)：