[attribute$="value"] Selector
The [attribute$="value"] selector is used to select elements whose attribute value ends with a specified value.
Note: The value does not have to be a whole word !
CSS Pseudo-elements
::after
Used to insert some content after the content of an element.
::before
Used to insert some content before the content of an element.
::first-line
Used to add a special style to the first line of a text.
::first-letter
Used to add a special style to the first letter of a text.
::placeholder
Points to the placeholder of input elements in your presentation, mostly found in forms.
::selection
Matches the portion of an element that is selected by a user.
First Letter Selector
The ::first-letter selector is used to add a style to the first letter of the specified selector.
Note: The following properties can be used with ::first-letter:
- font properties
- color properties
- background properties
- margin properties
- padding properties
- border properties
- text-decoration
- vertical-align (only if float is 'none')
- text-transform
- line-height
- float
- clear
Note: The ::first-letter selector can only be used with block-level elements.
Optional Selector
The :optional selector selects form elements which are optional.
Form elements with no required attribute are defined as optional.
Note: The :optional selector only applies to the form elements: input, select and textarea.
Tip: Use the :required selector to select form elements which are required.
Out of Range Selector
The :out-of-range selector selects all elements with a value that is outside a specified range.
Note: The :out-of-range selector only works for input elements with min and/or max attributes !
Tip: Use the :in-range selector to select all elements with a value that is within a specified range.