css selectors

Selector: The selector is a pattern used to select the element that you want to add a style to.First, the six major selectors are briefly describedBasic SelectorTag SelectorClass SelectorID SelectorAdvanced SelectorHierarchy SelectorStructure pseudo-Class selectorProperty SelectorThe basic selectors and hierarchical selectors are more commonly used.I. Basic Selec

Weights and precedence rules for CSS selectorsIn CSS, the order of the defined style rules is determined according to the particularity of the selector, and the rule with the more special selectors takes precedence over the rule with the general selector, and if the two rules are the same, then the rules that are defined first take precedence.Weight priority from

to a class selector or ID selector, followed by a tag selector, that indicates that the tag selector must be satisfied and that the following category or ID must be declared.The "Set" selector:Div,h1.first,p.specia{...}Multiple selectors are connected by commas, as long as the elements that satisfy either selector are selected.Descendant selector:div h1.first span.firstletter{...}Multiple selectors are con

1. P~ul P and UL have the same parent element, select all the UL elements after the P element, where p and UL are not necessarily immediately followed, but must have the same parent element E+f Adjacent sibling selector. Selects the element that matches F, and the element is positioned next to the adjacent position of the matched element E E>f The child contains the selector. F is a child element and E is the parent element of F

This article brings you the content is about in-depth understanding of CSS pseudo-class selector knowledge (code example), there is a certain reference value, the need for friends can refer to, I hope to help you. Objective In the past sporadic to understand and use :link , ::after and content other pseudo-class, pseudo-element selector, recently found this lack of reading, so decided to study a little bit, the following is the pseudo-class part of t

The particularity of CSS selectorsThe precedence of a CSS style sheet is from high to Low:1, inline style (inside HTML element)2. Internal style sheet (inside head tag)3. External style sheet (the style sheet that the link tag points to)4. Default settings for browser/user agent!important keyword-tagged style that will have the highest priorityThen, according to the particularity of the selector to determin

the CSS difficult to manage, so it is not recommended. The third-level precedence attribute is defined by one or more ID selectors. For example #id {margin:0;} will overwrite. classname{margin:3px;}. The properties of level fourth are defined by one or more class selectors, property selectors, pseudo-class

the groove)Above is the global style, of course, will be placed in the head of the HTML file, the following style is I write in the column of the current page, you can see, I wrote the highlight of the sampleFormula actually did not work, was covered, no reason ah, should be the style of highlighting before the style Ah, later on the home, so I looked at it,1min later, a flash of light, the selector weight ah, so change the type selector (increase weight), so the problem solved satisfactorily.T

1. Derivative SelectorYou can define a style based on the context of the element in its position to make the tag more concise.In css1, the selectors that apply rules are called contextual selectors because they depend on context relationships to apply or avoid a rule. In css2, they are called derivative selectors, but whatever you call them, they all play the sam

CSS Overview CSS refers to cascading style sheets (Cascading style sheets) Style defines how HTML elements are displayed Styles are typically stored in style sheets Add a style to HTML 4.0 to solve the problem of separating content from performance external style sheets can greatly improve productivity External style sheets are typically stored in

One, sub-selectorThe front and back parts of the child selector are separated by a greater-than sign, and the two-part selectors are structurally parent-child.A child selector is a parent element that is specified according to the left-hand selector, and then looks under the parent element for a child element that matches the right-hand selector.Second, a simple exampleDOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/

Often in our CSS style there will be several places to use the same settings, a separate write will be a tiring job, too high and too long to be redundant, more difficult to manage .... CSS syntax in the basic settings, you can put the same set of selectors together, the original may be written 7~8 line of the same grammar, together after just a small line, how t

left to right, the largest on the left, the first level is greater than the level, there is no binary between the levels, the level can not be exceeded.When multiple selectors are applied to the same element then the specificity value is higher and the final priority is obtained.Selector specificity Value list:Rules:1. The in-line style priority specificity value is 1,0,0,0, which is higher than the external definition. such as: The 2.!important decl

: selectors and style declarationsSelectors: Decide which elements are able to use defined rulesStyle declaration: A style rule surrounded by a pair of curly bracesSelector Selector{/* Style Rule */Property Name: attribute value;Property Name: attribute value;}Five, external style sheetStep1: Create a file with CSS suffixStep2: Writing code-related selectors in a

CssCCS is an abbreviation for cascading style sheets (cascading style Sheets)2.1 CSS Introduction method Inline style sheet: The start tag of the unload tag, whose scope is limited to the current element2. Internal style sheet: written in the label of the Web page, after the label is written, it is included with the External style sheet: written in the label of the Web page, after writing the tag , use tag to introduce code, introdu

CSS is flexible, and CSS hardening can reduce the complexity of the code.Collective declaration of selectorsIf some selectors have the same style style or are partially identical, we can use the collective Declaration methodh1,h2,h3,h4,h5,p{color:red;font-size:12px;}H2.special,.special, #special {text-family: "Song Body";}Nesting of selectors:P b{}

be, the structure is very clear. So focus on the CSS code.#d1和 #d2 are ID selectors, they want the background in the first div to be blue, the background in the second div to be yellow, and the font to be white;. c3 controls the P element in the third row of the second Div, which you want to be red;P controls the display style of the paragraph text in the full text, where you want them to be centered, and

Module agenda (module list) Selectors Combinators Color Properties Text Properties Box Properties 1. selectors Type selectors . Class selectors # ID selecors [Attribute] selectors Eg: [Data-author = Psmith] {color: red;} [data-author $ = 'Smith '] {color: red;}/* The data-a

Derived selectors (declared with HTML tags)ID selector (declared with DOM's ID)Class selector (declared with a style class name)Property selector (with DOM property declaration, belongs to CSS2,IE6 not supported, not commonly used, do not know to forget)In addition to the first 3 basic selectors, there are some extension selectors,Includes descendant

-child Select each 3 : Root : Root Select the root element of the document. 3 : Empty P:empty Select each 3 : Target #news: Target Select the currently active #news element. 3 : Enabled Input:enabled Select each of the enabled 3 :d isabled Input:disabled Select each of the disabled 3 : Checked Input:checked Select e