css advanced selectors tutorial

proficient in CSS: Advanced Web Standard Solutions (2nd edition)Jump to: Navigation, search Cascade of Importance: (That is,. User!important can overwrite the inline style) !important, user > author, last browser/user agent The calculation of the rule particularity (order): A,b,c,d assumes the same. Post-defined precedence Assuming that the inline style,a=1 Number of

css| Advanced | web | syntax Grouping of selectors You can group selectors so that the grouped selectors can share the same statement. Separate the selectors that need to be grouped with commas. In the following example, we groupe

"alt=" Wkiol1byc6siedymaacophzrvrc869.png "/>Four, pseudo-element selectorPseudo-element: First-letter-: First-letter selector to select the first letter of the specified selector-often used for typesetting details such as initials highlighting, sinking, etc.650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M01/7D/E2/wKiom1byC32ysFjHAACGOSu3dec073.png "title=" Web.png "alt=" Wkiom1byc32ysfjhaacgosu3dec073.png "/>Pseudo-element: First-line-: First-line selector for selecting the first row o

of CSS sprites and application methods. Animated GIF for CSS SpritesA more specific application Image Sprite Navigation with CSSHow to make a simple hover menu effect Advanced CSS Menuor hover effect Creating and Using CSS SpritesA very basic

wars, when support for standards is not a business priority. For example, Netscape 4 does not support inheritance, it ignores inheritance, and also ignores rules applied to the BODY element. Ie/windows until IE6 there is a related problem, the font style inside the table is ignored. What are we supposed to be doing?Treat Netscape with Kindness 4Fortunately, you can deal with the Legacy browser's inability to understand inheritance by using the redundancy rules we call "be Kind to Netscape 4".Bo

Some advanced uses of CSS annotationsQuasi-modifier selector (quasi-qualified selectors)You should avoid overly modifying selectors, for example if you can write. nav{} try not to write ul.nav{}. An overly-modified selector will affect performance, affect class reusability, and increase the selector's private degree. T

DOCTYPE HTML>HTML>Head> Metahttp-equiv= "Content-type"content= "text/html"; CharSet= "Utf-8"> title>The relationship between HTML and CSStitle> styletype= "Text/css">H1{font-size:12px;Color:#930;text-align:Center; }span{Color:yellow;}style>Head>Body> H1>HelloH1>Body>HTML>Composition of CSS: selectors, declar

, completely ignored: focus. IE7 is supported on any element: hover, but ignored: active and: Focus.By linking pseudo-classes together, you can create more complex behaviors. A:visited:hover{color:olive}5. Universal Selector. (can be used to apply styles to all descendants of an element)6. Sub-selector (different from descendant selector): example: #nav >li{...}, the child selector selects only the immediate descendants of the element, that is, the child element.7. Adjacent sibling

/wKiom1byQP2yuHuqAAD9y1u_iFA447.png "title=" Web.png "alt=" Wkiom1byqp2yuhuqaad9y1u_ifa447.png "/>650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M01/7D/E2/wKioL1byQxbxzmg1AAEj7o8SuIc173.png "title=" Web.png "alt=" Wkiol1byqxbxzmg1aaej7o8suic173.png "/>Selector hack-Selector Prefix-precede CSS selectors with prefixes that are only recognized by certain specific browsers-* Prefix: IE6, such as *html-*

Before learning CSS, I always felt like it was a matter of design personnel. This idea went backwards with time and found that it was not the case at all. No, I quickly found this proficient CSS and looked at it, I also learned a lot. I have recorded the key parts for your convenience and convenience! Page Navigation:Advanced selector: Sub-Selector | adjacent compatriot selector | attribute SelectorBox Mod

The following main reference http://www.cnblogs.com/wangfupeng1988/tag/css know how much/CSS Step-by-Step notes:first, Learning CSS Three breakthroughs1. How the browser loads and parses the 5 sources of css--css;How 2.CSS and HTM

Some advanced uses of CSS annotations Quasi-modifier selector (quasi-qualified selectors) You should avoid overly modifying selectors, for example if you can write. nav{} try not to write ul.nav{}. An overly-modified selector will affect performance, affect class reusability, and increase the selector's private degre

transparent effect, you need to use the hacks, so it is not recommended. Therefore, for the mask of a GIF picture, a rounded rectangle with a small radian has a better effect, and a large radian fillet rectangle may appear jagged. The same need to add extra non semantic tags, semantic enthusiasts can use JavaScript to do this work. 5. CSS Sprites Rounded corners CSS Sprites is not a specially crafted ro

CSS advanced Selector The following example describes how to use nth-child, first-child, last-child, nth-of-type, first-of-type, and last-of-type. Sample Code: Summary: Except that the first-child selector is compatible with IE7 + and later, all other selectors must be compatible with IE9 or later browsers..

top style.CSS selector namingThere are three types of CSS selectors to name: Camel nomenclature, Pascal's nomenclature, Hungarian nomenclature, and below we look at:Camel name Law: refers to the combination of uppercase and lowercase letters to form, but also for later work in a team communication is more convenient. It features the following:The first word begins with a lowercase letter, the first letter

Previous CSS Tutorial article: CSS Advanced skills: Picture replacement Web Teaching Network Sliding Doors (sliding Doors) or decided to separate the sliding door into a separate technique. It is a new technology introduced by

corresponding label according to the specified property name, then set the property [Attribute=value]-Action: Find a label with the specified attribute, and the value of the property equals the tag of value, then set the property-The most common application scenario is to differentiate the input attributeInput[type=password]{} The value of the property begins with what [Attribute|=value] CSS2 [Attribute^=value] CSS3 The difference between the two: Only th

In the first section, we introduced the CSS workflow, I believe the reader will have a general understanding, then we will be in-depth study of CSS details, these issues will make our work more perfect.Comment ************1.CSS also need to comment, the contents of the note will not be interpreted to execute, it is the same as the C language, with/* beginning, wi

Css Preprocessor sass usage tutorial (Multi-image warning), sass usage tutorial The css Preprocessor provides css dynamic language features, such as variables, functions, operations, inheritance, and nesting, to help organize and manage style files and develop projects more

css| Tutorial | style sheet Text: CSS control text attributes mainly include the following four: Text-indent, Text-align, Text-decoration, Text-transform; 1. Text-align: Property text-align refers to the alignment of the text, which has left, right, center alignment, and automatically adapts to the four alignment methods: Text-align:left;Text-align:right;Text-ali