鑒于某些 CSS 規則是針對特定 HTML 元素量身定制的（一些示例 - object-fitfor <img>、<video>等；stroke以及fill針對各種 SVG 元素的其他 SVG 規則），并且在用于其他元素時不太有意義：將任何有效的CSS 規則應用于任何 HTML 元素是否合法？任何規則都可以繼承嗎？繼承的值是什么，特別是當它是從使用特定屬性沒有意義的元素繼承的情況下？我的具體問題是這樣的。我正在開發一個帶有模塊化 CSS 的按鈕組件。在這個按鈕內，我可能有一個用于顯示圖標的 SVG 元素。我希望能夠從組件外部將某些樣式應用于圖標（即描邊和填充），同時保留適當的封裝（因此深度選擇器是禁忌）。為了解決這個問題，我將 SVG 設置為從按鈕繼承描邊和填充。如果我現在將這些屬性應用到按鈕，圖標就會繼承它們，并且我會得到所需的結果！然而，這讓我想知道我所做的是否有效以及其他瀏覽器是否會有相同的行為。這似乎是常識，但要找到明確的答案卻出人意料地困難。如果有人可以向我指出規范的摘錄，甚至可能是一些支持表，我會很高興！考慮到我編寫代碼的方式，顯示 100% 準確的示例有點太多了，但基本上我是在問這是否有效：.icon {  stroke: inherit;  fill: inherit;}.button {  stroke: #FFF;  fill: #999;}<button class="button">  <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18">    <g stroke-width="2" transform="translate(1 1)">      <path d="M14 2L2 14"/>      <circle cx="8" cy="8" r="8"/>    </g>  </svg>  <span>My button</span></button>