CSS Introduction method, Advanced Selector

Source: Internet
Author: User

CSS Introduction Method:
1. Internal style
style tag
in the head tag
Application scope: currently applied throughout the page
2. Inline style
Style Property
<p style= "color:black; font-size:24px" > Inline style </p>
Application scope: specified in-label application, higher priority than internal style
It's not recommended in this way .
3. External style
Disclaimer:. CSS style Files
introduced:
link mode: <link href= "CSS file" rel= "stylesheet" type= "Text/css"/>
        
apps: Sharing across multiple pages
Priority level:
inline > Internal > External
Note: Priority is considered when you have the same style
CSS Advanced selector:
1. Descendant selector:
apply to elements that have nested relationships
Selector 1 Selector 2, separating each selector with a "space"
2. Intersection selector:
Selector 1 Selector 2, each selector is linked directly together
further narrowing down the selection range
. Clcss class selector, applied on any tag
p. clcss descendant selector, applied to a child tag on the P tag
p.clcss intersection selector, applied on p mark with class= "Clcss"

#p1. CLS: Select the tag with the id attribute "P1" and select class in the tag
is a sub-tag of "CLS"
3. The set selector:
Selector 1, selector 2, selector 3{};
apply: Set the same style for different selectors
Note: The selector is a previously learned arbitrary selector
Inheritance Features:
tag with nested relationship, outer tag called parent tag, inner tag called child tag
A child tag can inherit the style of a tag, which in turn is not true

CSS Introduction method, Advanced Selector

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.