currentColor 關鍵字

Created: November-22, 2018

currentColor 在內聯 SVG 中最有用。有了這個，你可以繼承父 css 顏色，並在 SVG 中使用顏色的任何地方使用它。

在此示例中，第一個圓圈使用文字顏色作為填充顏色，第二個圓圈使用它作為筆觸顏色。

<html>
    <head>
        div{color:green}
    </head>
    <body>
        <div>
            some Text
            <svg width="2em" height="1em" viewBox="0 0 200 100">
                <circle cx="50" cy="50" r="45" fill="currentColor"/>
                <circle cx="150" cy="50" r="45" fill="none" stroke-width=5 stroke="currentColor"/>
            </svg>
        </div>
    </body>
</html>