次のようなファイルで css セレクターに遭遇しました。
#contactDetails ul li a, a[href^=tel] {....}
曲折アクセント記号「^」自体は、CSSでは定義された意味を持ちません。2文字の演算子「^=」は属性セレクターで使用できます。一般に、で始まる値を持つ[attr^=val]
属性を持つ要素を指します。attr
val
したがって、で始まる値を持つ属性を持つ要素をa[href^=tel]
指します。これはおそらく、電話番号のリンクを他のリンクと区別するためのものです。セレクターも一致するため、これには十分ではありませんが、プロトコル部分としてのリンクのみを一致させることを意図している可能性があります。だからより安全だろう。a
href
tel
<a href="tel.html">...</a>
tel:
a[href^="tel:"]
a[href^="tel"]
( ^
) は、特定の文字列で始まる/始まる値を持つ指定された属性を持つ要素を選択することを意味します。
ここでは、すべての「アンカー」要素を選択します。href
属性の値は文字列で始まります'tel'
そのように使用されるカラット「^」は、href が「tel」で始まるタグと一致します ( http://csscreator.com/content/attribute-selector-starts )
href 属性が「tel」で始まるタグを意味します。
例:
<a href="tel123xxx">This is a link</a>
一致します。