Vaadin組件爲特定類的CSS

Question

我想從每個使用特定CSS類的網格實例中刪除網格單元格焦點樣式。

的CSS

.v-grid-cell-focused:before { 
    display: none !important; 
} 

的偉大工程，但在我的應用程序在所有網格實例應用的樣式。

我試圖使它通過專門適用於CSS類：

.mygrid.v-grid-cell-focused:before { 
    display: none !important; 
} 

或

.v-grid-cell-focused.mygrid:before { 
    display: none !important; 
} 

或

.mygrid > .v-grid-cell-focused:before { 
    display: none !important; 
} 

，反而會導致從默認的行爲沒有任何變化。

我已經成功地使用了下面的CSS

.v-grid-cell.anotherGrid { 
    background-color: #07a9ca; 
    color: #000; 
} 

其中所採取的上述造型唯一的網格是，我分配到樣式名稱anotherGrid到的。這暗示了CSS選擇器可能會有一些複雜性，在我的案例:before中，加上導致我的實現不起作用的自定義CSS類。

如何引用Vaadin組件CSS並將其僅應用於指定的特定CSS類？

Answer 1

我有同樣的要求，對我來說，下面的工作作風：

.mygrid .v-grid-cell-focused:before { 
    display: none !important; 
} 

通知，這意味着，不僅可以選擇直接孩子.mygrid和.v-grid-cell-focused:before之間的空間（如您>所做的那樣）。