表示：クラスに画像がない場合

Question

上記のコードを使用して、各PDFファイルをダウンロードする前にpdfアイコンを表示します。

a[href*="pdf"]::before { 
    content: url('../gfx/pdficon.png'); 
    display: inline-block; 
    vertical-align: middle; 
    padding-right: 5px; 
} 

このアイコンが必要ないimgのようなオブジェクトにアイコンが表示されると問題が発生します。 このアイコンが表示されないように画像に追加するためのクラス「nopdf」を作成するというアイデアを思いつきました。

どのように私はCSSでそれを適用できますか？私は "display：none"には十分だと思いますが、この場合はルールcssをどのように構築するのですか？

EDIT：画像に（href）をリンクするときに問題が発生します。その後、画像の前にpdfアイコンが表示されます。

Answer 1

a.nopdf::before { 
    display: none !important; 
} 

またはあなたがちょうどそうのようなあなたの既存のルールを拡張：

a[href*="pdf"]:not(.nopdf)::before { 
    content: url('../gfx/pdficon.png'); 
    display: inline-block; 
    vertical-align: middle; 
    padding-right: 5px; 
}