原文demo链接地址 ❝ 最近在做网站换肤的需求，也就是主题切换。那么如何切换主题的颜色呢？以下是网站换肤的实现以及基于换肤拓展的一些方案分享给大家，希望大家在做类似需求的时候能够有些参考。 &#

Learn about how to write defensive CSS.

随着 iOS 13 的发布，深色模式（Dark Mode）越来越多地出现在大众的视野中，支持深色模式已经成为现代移动应用和网站的一个潮流，前段时间更是因为微信的适配再度引起热议。深色模式不仅可以大幅减少电量的消耗，减弱强光对比，还能提供更好的可视性和沉浸感。 那针ֿ

我们开发的 Web 页面如何在可折叠设备和双屏幕上完美的运行

在日常布局当中，肯定经常会遇到文本内容超过容器的情况。非常常见的一种解决方案是超出省略。 但是，有的时候，由于场景的限制，可能会出现在一些无法使用超出打点省略的方法的场景，譬如在导航栏中： 这种情况下，在容器定宽但是文本又n

常见布局的实现思路和具体方案。

众所周知，“css如何实现元素垂直居中？”已经是一个老生常谈的问题了，这个问题目前已经有了许多解决方案，这些方案也都有各自适用的场景以及优缺点，大致如下： flex布局 grid布局 table布局 line-height搭配height position搭配margin position搭配transform ... 那么今天我们就来理解其中一种ٰ

为什么CSS Paint API对我们有用？有哪些用例？

传统网页的呈现是基于像素单位的，所以图片不能和 SVG 一样进行任意尺寸缩放后还保持边缘平整。也就是说，放大像素逻辑的图片，必然导致可视质量下降（信息失真）。所以我们往往会使用技术手段去规避失真，如： 使用 SVG 替换位图 使用矢量字体（如

下面总结了一些常用又有趣的css技巧，希望大家收藏，以减少查资料的时间。 最常见的一种形状了。切图，不存在的。 /** 正三角 */ .triangle { width: 0; height: 0; border-style: solid; border-width: 0 25px 40px 25px; border-color: transparent transparent rgb(245,…

饼图是数据统计图表里常用的图形，在很多应用中都需要使用。对于简单的饼图，不需要引入复杂的图表库，只要用简单的CSS就能实现。

讨论我所看到的所有有趣的事情

在 React 项目中使用 CSS 时，如果不使用 CSS in JS 的方案，一般会直接在 JS 文件中导入一个 CSS 文件，但这样 CSS 会在全局作用域内都有效，所以我们会使用 CSS Modules1 来解决作用域的问题。

Adam Wathan 是 TailWind CSS 的作者，在他发布 TailWind 之前写过一篇文章，这篇文章详实地梳理了 CSS 诸多方案之间的演变历程和权衡取舍，深有感触，想来大家概有相似的考虑，故译为中文分享给大家！

不管哪种解决方案或者技术手段，都有自己的利弊，没有最好，只有最适合的使用场景。

这篇文章发布于 2020年02月13日，星期四，17:35，归类于 CSS相关, JS实例。 阅读 11727 次, 今日 31 次 18 条评论 by zhangxinxu from https://www.zhangxinxu.com/wordpress/?p=9263 本文欢迎分享与聚合，全文转载就不必了，尊重版权，圈子就这么大