継承を使用しているときにCSSオーバーライド

Question

矢印を表示するために使用されるCSSクラスをオーバーライドしようとしています。私は矢印を消したい。このクラスはLiferayテーマにあります。

このCSSクラス：

.v-tabsheet-tabitem-selected:after { 
    border: 10px solid; 
    border-bottom-width: 0; 
    border-color: #333 transparent transparent; 
    bottom: -6px; 
    content: '-'; 
    display: block; 
    height: 0; 
    left: 50%; 
    margin-left: -10px; 
    position: absolute; 
    text-indent: -9999px; 
    width: 0; 
} 

私がやった：

.v-tabsheet-tabitem-selected:after{ 
    content: none;  
} 

それは動作するようには思えない、他の方法はありますか？

Answer 1

それは矢印がCSSの境界線で描かれているように見えるので、これでそれを上書きしてみてください：適用していますホバースタイルのどこかに、またはれるonmousemoveないいくつかのJS ...：

.v-tabsheet-tabitem-selected:after {border: none;}

Answer 2

あなたが指定したCSSについては、カーソルの位置は関係ありません。つまり、:hoverセレクタを別の場所に適用するか、マウスイベントに基づいて適用するJavaScriptを使用します。