IT Band of Brothers HTML5 CSS3 Tutorial Secret CSS selector 2

e008c0cf511043aab8faeb9fb30f63ad.jpg

 

Associated selector 4

Associated with the selected string is simply a space separated two or more single selector thereof. These selectors can be specified general attributes, and because the rules of the stacking order, which is larger than a single priority selector. In this manner only the second elements are defined in the first element in the associated (as long as the intermediate elements can have the relationship, the relationship can have other layers of HTML elements), the individual first or second element no element of the definition. As follows:

table a {color: red} / * Only in the link table in <a> <table> style change * /

This embodiment is defined in Table <table> <a> change in the link style, text color is red, while the outer table link text color does not change.

 

5 combination selector

To reduce redeclaration style sheet declaration selector combinations are allowed, as long as the comma (,) separated by the selector on it. For example, all of the document can be given the same title by combining a statement, as follows:

h1, h2, h3, h4, h5, h6 {color: red; font-family: sans-serif} / * Use the title compound selector modified * /

Pseudo-element selector 6

Pseudo-element selector refers way to define different states of the same HTML element. For example, the normal state for <a> tag, access state, selected state, the state of the cursor on the hyperlink text, can be used to define pseudo-element selector. Its grammatical structure is as follows:

HTML tags: pseudo-element {attribute: value;} / * syntax structure dummy selector elements * /

Each of the dummy elements in English ":" at the beginning, followed by the name of the pseudo-element has its own different role according to a fixed wording. Colon and front pseudo-element need to specify HTML tags, only <a> or <p> tags are available. Specifies hyperlink element displayed in a different way links (links), move the cursor to the hyperlink (hover links), when the visited link (visited links) and can activate the link (active links), the positioning elements may be given the pseudo link, hover, visited, or active. A link has access can be defined as different colors and even different font sizes and styles. As follows:

336847a91d0f4c4991717ec3188bebe0.png

Effect of the present embodiment is that the current link in the access state, in different colors, a larger display size. When a web page has been visited links re-election, again in different colors, smaller font display.

Note that when multiple CSS selectors act simultaneously on the same HTML element, a different statement attribute inheritance relationship. If the statement is the same properties, places a high priority selector based. The main priority relationship selectors are as follows:

Associated selector> ID selector> class selector> HTML selector à left to right CSS selectors decreasing precedence

Guess you like

Origin www.cnblogs.com/itxdl/p/11756661.html