HTML selector
Three basic selector
Tag selector html {properties:}
id selector #id {properties:}
class selector .id {properties:}
weights weights tag minimum weight of the usual argument score of 1 point
highest weight id selector right typically 100
selector weight class is generally the minimum weight 10.
// score is determined here for convenience only, which does not actually exist
specific tail see text
Senior selector
And set "and set" Selector: substantially simultaneously each selected range selected by the selector, the selector in any form can be, set and select a plurality of selectors is connected to each comma. For example h1, h2, h3 {color: red; font-size: 23px;}
intersection "intersection" Selector: directly connected by the two selectors configured, the result is the intersection of the two respective selected range of elements, wherein the first must is a marker selector, the second selector or category must ID selector, no spaces between the two must be continuously written .div selectors. d1 select a tag div class named d1
descendant descendant elements selected inside it .box e.g. .D1 selected class named .box p p tags .D1 following the
sub-element selector .d1> a select class called a tag .D1 following
adjacent sibling selector div + p div p tags later selected
denomination p tag all been selected after ordinary sibling selectors div ~ p div
wildcard * {color: red} the asterisk represents all, so color is red
hyperlinks pseudo-class selectors: link hyperlink initial state
: visited hyperlink state after being visited
: hover your mouse hover over the link status
: active hyperlink is activated, press release did not state
CSS3 selectors
Attribute selectors
E [attr] attr refers to a class property
E [attr = value] class attribute value
E [attr ^ = value] class value is the beginning value
E [attr $ = value] class value is the end value
E [attr * = value] subtopics. 1
E [attr ~ = value] ~ class class attribute value is separated by a space
E [attr | = value] class value or attribute value is the beginning of the class value-
Structure pseudo class selector
nth-child () nth-child (1) of several sub-elements
of the element odd odd odd
even even-numbered even-numbered elements
3n astigmatism multiple of three elements of a multiple
first-child a first child element of
the last last-child child element
only-child has only one child element
nth-of-type () to select parent element matches the n th element of
first-of-type selector element matching a particular type of parent first child element.
nth-last-child () selector to select parent element of the N specified type sub-element, from the last child element counting
nth-last-of-type ( ) N th element selector to select parent element, and regardless of the type, from the last child to start counting
: root only the root element
: empty selection no children label
only-of-type represents any one element, which no other same type of siblings, also known as only a child element.
Pseudo target class selector
: Target selector can be used to target elements of the style currently active.
ui state pseudo class selector
disabled disable one input attribute disabled: disabled; input = disabled;
Enabled input: Enabled Label available
focus input: focus so that input gets focus
checked input: checked; the default option. Multi-use menu box
:: selection selected content
Negative pseudo class selector
: Not negate the selected class name is not negated
Dynamic pseudo class selector
: the state before the link click
: state visit after being visited
: hover hover state
: active state before click let go
Weight comparison
id, class, html tag selector number of
different weights heavy weights look
weights look the same position
inherited to see who is nearly
as close, more weight
is not as important to listen to who's right who's
weightings, listen back
The common finishing just finishing, not comprehensive informational purposes only. Problems can leave a message correction.