暗模式的粉丝

Thomas Steiner 的一个绝妙技巧！Chrome 即将支持 SVG 收藏夹图标（例如：）。你可以在 SVG 中使用 <style></style> 元素嵌入 CSS。这个 CSS 可以使用 prefers-color-scheme 媒体查询，从而创建一个支持深色模式的收藏夹图标！

<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
  <style>
    circle {
      fill: yellow;
      stroke: black;
      stroke-width: 3px;
    }
    @media (prefers-color-scheme: dark) {
      circle {
        fill: black;
        stroke: yellow;
      }
    }
  </style>
  <circle cx="50" cy="50" r="40"></circle>
</svg>

Safari 也支持 SVG，但方式有所不同……

你需要指定颜色，因此没有机会实现深色模式。这有点令人惊讶，因为 Apple 如此大力支持深色模式。我不知道他们是否计划解决这个问题，或者有什么计划。

以上是暗模式的粉丝的详细内容。更多信息请关注PHP中文网其他相关文章！