可变字体于 2018 年首次实验性地引入 Chrome 和其他浏览器。如今，它对该功能的支持覆盖了 90% 以上的网络用户。不仅如此，可变字体也很棒。让我们看看它们是什么，以及如何使用它们。
什么是可变字体？#
简而言之，可变字体是真实类型字体规范的演变，这意味着所有可能的字体粗细和样式[……]
分类： Css
如何使用 CSS 为 SVG 路径设置动画
在最近的教程中，我创建了一堆复选框，其中一个具有平滑线动画：
而这一切都可以通过 CSS 来完成。SVG 元素如下所示：
CSS是这样的：
那么它是怎样工作的？stroke-dasharray指的是虚线的宽度和线条的白色部分，stroke-dashoffset指的是虚线的起[……]
仅使用CSS的条纹状平滑过渡菜单
我最喜欢的网站之一是 stripe.com。有很多WebGL，但顶部的菜单具有非常酷的幻灯片效果，因此当您浏览它时，它似乎会变成下一个选项。我查看了它是如何制作的，其中有很多 Javascript 代码，但它让我思考是否可以仅使用 CSS 来完成类似的效果。
在本教程中，我们将介绍我是如何做到[……]
创建自定义的交互式 CSS 复选框
在过去的几天里，我一直致力于创建一些使用伪元素、SVG 动画和其他一些技术的创意复选框。对于一些人来说，我使用了一点 Javascript 来提供更多选项。
对我来说一个很大的烦恼是复选框返回的值是 on 和 off，所以对于这些我创建了一个隐藏的输入，它为一些具有多个选项的复选框返回值 1、[……]
使用 Javascript 更新 CSS 变量
如果您正在构建应用程序或 SaaS 平台，或者实际上是任何网站，将所有颜色存储为 CSS 变量，然后更新这些变量以更改应用程序的主题会很有用。
幸运的是，这相对容易实现。想象一下，您的 CSS 变量设置如下：
:rootCSS 样式存储在document.documentElemen[……]
如何在 CSS 中禁用文本选择
在网页上，我们通常不应该禁用文本选择，但在某些情况下启用它会影响用户体验。通常，我们不想剥夺用户选择文本的能力，因为这会导致糟糕的用户体验。曾经有一段时间，少数网站会阻止用户复制文章文本作为阻止抄袭的一种方法，但幸运的是，这种情况在今天已经不常见了。
话虽如此，有很多例子表明禁用文本选择实际上[……]
CSS 图层教程：真正的 CSS 封装
CSS层是我们将 CSS 分离成逻辑片段的一种方式。使用 CSS 层，我们可以完全封装我们的 CSS 以供导入。这意味着导入到您的项目中的模块、脚本或任何其他内容都可以拥有与您自己的完全分离的 CSS，从而解决了样式相互覆盖的古老问题。它还将让我们使用自定义导入语句添加到页面中的 CSS 更加灵活。[……]
初看 CSS When 和 Else 语句
在 CSS 中，我们使用媒体查询来选择不同的设备。媒体查询为我们提供了一种基于多种条件选择设备的简单方法，例如屏幕尺寸、像素密度，甚至格式：即打印或屏幕。
随着时间的推移，这逐渐变得更加复杂，现在我们经常平衡许多有时相互冲突的条件。
新的CSS 条件规则 5 规范试图通过引入两种新的媒体[……]
使用 CSS 垂直居中文本和 HTML 元素
在 CSS 中垂直居中并不像你想象的那么容易，在我们得到像flexbox这样的工具之前，这真的很难。幸运的是，现在在容器中垂直居中非常容易。让我们看看如何实现它。
在 CSS 中将项目垂直居中
假设我们有一些简单的 HTML，其中一个 div 在名为.item的容器中调用#contain[……]
使用 HTML 和 CSS 创建图像滑块
在本文中，我们将学习如何使用 HTML 和 CSS 创建图像滑块。您可以在下面的链接中查看完整的源代码。
https://codepen.io/taimoorsattar/pen/yLJBdKO
首先，我们可以构造我们的 Html 代码，如下所示：
您可以添加任意数量的图像。要[……]