2

ラップアラウンド:beforeされた要素で疑似要素を使用できるかどうかを確認することに興味がありますか?<a href<button>

現在、Firefoxは要素の後ろに細い青い線を表示しています。<button>これは、要素が。で囲まれているため<a hrefです。

行内でインラインスタイルを使用すると<a href、行が消えます。

<a href="#" style="text-decoration:none;"><button>

ただし、<button>複数のページに要素があるので、可能であればCSSを使用してそれらをターゲットにします(特に、サイトで'<a hrefをラップしているすべての要素にクラスを追加したくありません)。これは、疑似要素が役立つと<button>思っていたところですが、機能していないようです。:before

a:before button{
    text-decoration:none !important;
}

これは<button>、Firefoxでのの表示方法です。に適用される青いデフォルトのテキスト装飾を参照してください<a href。右側にのみ表示される理由は、のクラスが要素margin-left:5pxに適用されているためです。<button>

ここに画像の説明を入力してください

jsfiddleにあるボタンの基本バージョンは次のとおりです(わずかな外観の違いは無視してください):http://jsfiddle.net/Vtjue/2/

何か案は?

4

1 に答える 1

3

およびセレクターは、DOM とは別に存在し、ブラウザーによってオンザフライでレンダリングされる、生成された要素を参照します:before:afterつまり、HTML 構造をトラバースするためにそれらを使用しないということです。

CSS セレクターの性質上、 を含む を選択することはできませんabuttonその逆 (buttonに含まれるa) のみです。残念ながら、あなたの唯一の選択肢は、クラスを使用するか、意味的にそこに属していないため、クラスをbutton離れて移動することです。a

于 2011-02-18T00:35:50.210 に答える