小编sam*_*hae的帖子

深色模式下嵌入 SVG 图像的问题

标签内嵌入的 svg 图像不适用于媒体查询首选颜色方案和 CSS 变量(Chrome 和 Safari、Firefox 可以)。

<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="var(--color)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">
    <style>
        :root{--color:#ffffff;}
        @media(prefers-color-scheme:light){:root{--color:#ffffff;}}
        @media(prefers-color-scheme:dark){:root{--color:#000000;}}
    </style>
    <path d="M18 15l-6-6-6 6"/>
</svg>
Run Code Online (Sandbox Code Playgroud)

css svg media-queries

3
推荐指数
1
解决办法
3169
查看次数

标签 统计

css ×1

media-queries ×1

svg ×1