Vue3對style樣式進行了升級,以下這篇文章給大家總結分享一下Vue3 style的新特性,希望對大家有幫助!
Vue3.0後推出的setup函數,像寫JS一樣開發Vue元件,此外style也加入了許多新特性,如引入了變數和函數,使css復用性更強...
Vue3.2版本對單一檔案元件的style樣式進行了許多升級,如局部樣式、css變數以及樣式暴露給模板使用等。 (學習影片分享:vue影片教學)
##當c9ccee2e6ea535a969eb3f532ad9fe89 標籤有
scoped attribute 的時候,它的CSS 只會應用在目前元件的元素上:
處於hi
scoped 樣式中的選擇器如果想要做更「深度」的選擇,也即:影響子元件,可以使用
:deep() 這個偽類別:
透過預設情況下,作用域樣式不會影響到v-html
所建立的DOM 內容不會被作用域樣式影響,但你仍然可以使用深度選擇器來設定其樣式。
38b537b6886351ac721d89624ba185ca 渲染出來的內容,因為它們被認為是父元件所持有並傳遞進來的。使用
:slotted 偽類別以確切地將插槽內容作為選擇器的目標:
c9ccee2e6ea535a969eb3f532ad9fe89,可以使用
:global 偽類來實作:
#< ;style module> 標籤會被編譯為
CSS Modules 並且將產生的CSS 類別鍵暴露給元件:
$style 對象暴露給元件;
2、可以自訂注入module名稱This should be red
red
###(完) ###hello
以上是聊聊Vue3 style中新增了哪些特性(總結)的詳細內容。更多資訊請關注PHP中文網其他相關文章!