メールリンクを改善します

メール

CSS属性セレクターとは何ですか?
CCSは、要素自体のタイプではなく、リンク属性に基づいて要素をスタイルする機能を提供します。 たとえば、ヘッダー要素h1を装飾する方法は既に知っています。

h1 { color: blue; }

ヘッダー属性をもう少し明確に定義できます。

h1[title] { color: blue; }

さらに先へ進むことができます:

h1[title="Go Home"] { color: blue; } /* "Go Home" */
h1[title~="Go Home"] { color: red; } /* "Go Home" - */
h1[title^="Go Home"] {color: green; } /* "Go Home" */


SOAPリンクのユニークな点は何ですか?
それでは、前の例の経験を活用して、これを構築しましょう。

a[href^="mailto"]:hover:after { content: attr(title); }

ホバーに設定したヘッダー属性。 これは機能しますが、リンクの直後にテキストが表示されることがあります。 したがって、次のコードを修正します。

a[href^="mailto"]:hover:after { content: " > " attr(title); }

何が起こった:

[ ]

[*]私たちのお気に入りのブラウザであることを明確にするための場所になります-IEはコードを誤って表示しますが、慣れています。

Source: https://habr.com/ru/post/J19560/


All Articles