HTML and CSS Reference
In-Depth Information
Figure 5-7.
Text shadow effect (left) and stroke effect (right)
Selectors
Selectors allow you to apply styles to DOM elements using CSS. There are
usually two types of selectors: regular CSS class and element and ID selectors,
such as
.elementclass
,
#elementid
, and
element
. There are also
pseudoselectors, such as
:link
,
:visited
,
:hover
, and
:active
.
CSS3 introduces several new selectors that allow you to select elements based
on attribute values, input state, and an element's position within the DOM.
Useful Form Selectors
Form selectors will enable you to style form inputs based on their state or type.
Prior to CSS3, you needed to manually assign classes to text, checkbox, radio,
and submit fields and buttons, as there was no clear way to apply styles to
those fields. This is because they are all
<input />
elements, so any attempt to
create a global style for an input element would style all field types exactly the
same.
With CSS3, you can now apply styles to specific input types using the new
attribute selectors. Table 5-3 gives the attribute selector formats.
