Chapter III Application of CSS supplement

Source: Internet
Author: User
Application of the characteristics of the picker

  Before talking about the characteristics of a selector, it is a feature of CSS inheritance to mention. The so-called inheritance attribute refers to the style nature of the tag that is wrapped inside the label that will have the outer label. The most typical application of inherited features is to use the default style of the entire Web page, and to designate other styles as part of the individual elements.  This feature can provide a more ideal space for web designers to play. The next step is to talk about the application of the selector feature! In fact, this part should be regarded as a way of declaring, but after you have seen the basic statement and application of Chapter Two, you will have a more conceptual point when you go here and say the selection. In CSS applications or designs, there are several ways to set the display of specific properties based on the relationship or nature of the elements, which is the application of the selector feature, which allows you to be more flexible in terms of control and application. First, the former text selector: according to the declaration of the text of the label before the relationship shows a specific nature of the method. The previous selection is that when the browser displays the content specified in the HTML source code, the previous relationship of the element tag is taken into account, and the specified style declaration is displayed. That is, the declaration will work as long as the labels in the HTML source code are in the order in which they are arranged. Element A (label a) element B (label B) element C (label c) ... {Style Rule} It is important to note that the former selector's declaration is similar to the collective declaration, but the element tags of the collective declaration are separated by commas, and the element tags are separated by a space when the previous selection is declared, and both of these declarations can be used in a mixed manner. Element a element B, element c element D element E, ... {Style Rule} This allows you to declare the style rules of the previous selection of the array in the form of a collective declaration. Category selector: A method that allows single or several labels to use the same set of style rules. Category (class) allows different element labels to co-apply the same set of style properties or the same element tags to apply different groups of style properties. The first step is how to get different elements to apply the same set of style properties, as the following example writes. <HTML><HEAD><STYLE><--. Blue {color:blue}--></style>

Application of linked quasi-similar properties

Remember that in the basic syntax of HTML, you can use the link, ALink, Vlink properties to control the color of a linked or linked font in the body tag? It is also now possible to use CSS to control these properties, known as quasi-category (pseudo Class). As a general category, you can declare their style rules, but in fact, these quasi-similar categories do not have to be like the category selector mentioned above, and then set the category (class) in the HTML source code. The declarations and applications of quasi-similar categories are described below. General way of declaring: Quasi-category is declared with a colon. As long as the following declaration is added to the <STYLE>...</STYLE> schema, the link text in the page will be explicit according to the style you set! a:link {Style rule}a:active {style rule}a:visited {style rule}a:hover {style rules}a:link to set style rules for non-visited links. The a:active is used to set the style rules for the link in action. A:visited is used to set style rules for visited links. The a:hover is used to set the style rules when the mouse moves over the link.  And the hover is not supported by NC4, the other three features two major browsers have support. If you use more than IE4 browser, from the site link you can know the beauty of hover role, with a simple style set can be achieved in the past to write a long set of the same effect. This link quasi-category can also be used in combination with the category selector feature mentioned above.

Comparison of D i v with s p a n

Although style sheets can be applied to any label, the use of DIV and span elements greatly expands the application level of HTML. The two elements of DIV and SPAN are very similar in application, with the use of a trailing tag, which is < div>...</div> and <SPAN>...</SPAN>. Two properties that can be applied are similar to event handling, and can be written in conjunction with the previously mentioned picker feature.  Neither of them imposes a display function on the page content, which can be said to be a very broad element tag. The difference between div and span is that the DIV element is defined as a chunk (block) and is a very complete chunk of the paragraph between <DIV>...</DIV>. The SPAN element is defined as a coaxial (in-line),<span>...</span> applied to a small range of settings. The two can be mixed and used together, because they are independent of each other. As a result, you can use these two elements, with other properties, to flexibly adjust the content of your Web page display.

The above is the third chapter of the application of CSS supplement content, more relevant content please pay attention to topic.alibabacloud.com (www.php.cn)!

  • Related Article

    Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.