CSS Attribute Selector Part 4

Notes:

CSS Attribute Selector (Square Brackets) - Part 4 :

7.
selector[attribute name~=”value”]
{
declaration list;
}
It selects any html element targeted by the selector, which contains an attribute name where the attribute value is a space separated list of values, and contains a word specified as the value in the attribute expression

Ex:
a[title~=”my”]
{
border:2px solid red;
}
It selects any anchor element, which contains an attribute title, where title attribute value contains a word my

8.
selector[attribute name|=”value”]
{
declaration list;
}
It selects any html element targeted by the selector, which contains an attribute name where the attribute value begins with the value specified in attribute expression and immediately followed by hyphen (-) character.

Ex:
a[lang|=”en”]
{
border:2px solid red;
}
It selects any anchor element, which contains an attribute lang, where lang attribute value begins with en word and immediately followed by hyphen (-) character.

Interview Questions:

1. Which symbol indicates “begins with and immediately followed by” in attribute selector?
a. tilde
b. dollar
c. cap
d. pipeline
Answer: d