CSS属性 selector_html/css_WEB-ITnose の [attribute~=value] と [attribute*=value] の違い

[attribute]    用于选取带有指定属性的元素。    [attribute=value]    用于选取带有指定属性和值的元素。    [attribute~=value]    用于选取属性值中包含指定词汇的元素。    [attribute|=value]    用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。    [attribute^=value]    匹配属性值以指定值开头的每个元素。    [attribute$=value]    匹配属性值以指定值结尾的每个元素。    [attribute*=value]    匹配属性值中包含指定值的每个元素。    

下面的例子为包含指定值的 title 属性的所有元素设置样式。适用于由空格分隔的属性值：[title~=hello] { color:red; }下面的例子为带有包含指定值的 lang 属性的所有元素设置样式。适用于由连字符分隔的属性值：[lang|=en] { color:red; }

~=値は独立した単語である必要があります。たとえば、[title~=test] では、test a は選択できますが、testa は選択できません。
*=値は値の部分文字列のみである必要があります。たとえば、test-a、test a、testa はすべて選択できます。
|= は ~= と同じ特性を持ち、^= は *= と同じ特性を持ちます。したがって、通常は ^= と *= を使用することをお勧めします。