# 小程序組件化之二 > 前面學習了官網的基礎，現在編寫具體實例 > ### 作用域 * 樣式的作用域是獨立的，同名的類名是不會互相影響 組件loading的樣式 ~~~ /* pages/person/common/load/load.wxss */ Page { width: 100%; height: 100%; } .contanier { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .loading { width: 250px; height: 130px; } ~~~ 主頁面index的樣式 ~~~ .container { width: 10000px; background: black; } ~~~ 經過測試： class是不會互相覆蓋，不過page和標簽，id，屬性選擇器[1]會發生公用，影響主頁面的樣式 > 官網說明: > * 組件和引用組件的頁面不能使用id選擇器（#a）、屬性選擇器（[a]）和標簽名選擇器，請改用class選擇器。 > > * 組件和引用組件的頁面中使用后代選擇器（.a .b）在一些極端情況下會有非預期的表現，如遇，請避免使用。 > > * 子元素選擇器（.a>.b）只能用于 view 組件與其子節點之間，用于其他組件可能導致非預期的情況。 > > * 繼承樣式，如 font 、 color ，會從組件外繼承到組件內。 > > * 除繼承樣式外， app.wxss 中的樣式、組件所在頁面的的樣式對自定義組件無效。 >