在做專案的時候，用到過pig框架（pig框架飛機票），該框架前端採用的是vue框架，**絕大部分都是用**生成器生成的，之前也一直沒用過都是現學現賣。因此，總避免不了掉坑里，其中vue樣式的scoped屬性就是乙個大坑。
一下就是**生成器生成的部分樣式**：
編輯
刪除專案的要求就是要把生成的**的表頭新增乙個背景顏色。我們從頁面**就可以看出，這**裡面根本就沒有關於**的**，所以**是由js檔案動態生成的，那麼，想要修改原生的元素樣式，也不難。只要開啟頁面，審查元素檢視**表頭的屬性（包括：類名、id、name等等），然後新增樣式就行。嗯，思路就是這樣沒錯。於是我開始在這裡面寫樣式**。寫好一看，傻眼了，表頭內容沒了。後面不管再如何折騰，表頭都不出來，除非把裡面的**全刪掉。於是，我把目光鎖定在了這段樣式**裡面。
我發現了乙個平常沒見過的屬性：scoped。經過查資料才發現這個屬性是html5特有屬性，作用就是圈定樣式的作用範圍。
知道問題所在就好解決了。於是我自己重新寫了乙個樣式標籤，全部樣式如下：
vue元件中的樣式屬性scoped例項
vue元件中的style標籤標有scoped屬性時表明style裡的css樣式只適用於當前元件元素 接下來通過本文給大家分享vue元件中的樣式屬性scoped例項詳解 scoped css scoped css規範是web元件產生不汙染其他元件，也不被其他元件汙染的css規範。vue元件中的styl...
vue使用less識的scoped屬性
scoped可以實現style只作用於當前的.vue檔案 scoped 譯 審視，仔細研究 scope的過去式與過去分詞形式 class user div template script lang less scoped user style 上面的檔案渲染出的dom結構會是這樣的 然後渲染出來的c...
Vue中scoped屬性相關
scoped屬性相關 一般在專案中都會用到，新增了scoped屬性後，vue會通過postcss 給乙個元件中所有的 dom 新增了乙個獨一無二的動態屬性，然後給 css 選擇器額外新增了乙個對應的屬性來選擇該元件中的 dom，這種做法使得樣式只作用於含有該屬性的 dom 元件內部 dom titl...