标签等
div{--这就是html选择器形式
color:Yellow;
font-size:20px
}
什么是class选择器?
.lei{--这就是class选择器形式
color:Yellow;
font-size:20px
}
在页面中可以这样调用 :
我是中国人
p.one{} -- represents the one selector under the P tag (can only be used under the
tag)
What is the id selector?
#aaa{--This is the id selector form
color: Yellow; > It can be called like this in the page:
I am Chinese
Note: On the same page, there cannot be id selectors with the same name.
Similar to a nested form.
For example: p em{ -- This is the form of the associated selector, separated by spaces
Color: Red;
Font-size: 16px
}
The above association selector emphasizes that the em tag must be nested in the P tag to be effective. (Emphasis on the nesting order: the later tags must be nested within the previous tags)
On the page: --This will be effective.
device?
P,div,a,h1,.one,#two{
Font-size:16px;
Color:Red
}
This type of comma-separated selector is called a combination selector
Feature: all the above tags can use these styles, unlike the associated selector, which can only nest the correct capabilities according to regulations Use these styles
What is a pseudo-element selector (pseudo-class)?
a:link{}
a:hover{}
a:visited{}
Use pseudo-element selectors with classes:
a.one:link{}
a.two:hover{}
a.three:visited{}
Dynamic pseudo-class
:focus indicates the element that currently has input focus (ie7 form elements do not support this pseudo-class)
Select the first element
#header P:first-child Select the first element in the header A paragraph
P:first-letter P:first-letter P:first-letter P:first-line over in the first letter of the paragraph
Note: These two pseudo-classes can only be applied to block-level elements such as tags or paragraphs, and cannot be applied to inline elements such as hyperlinks
: before and after
These two pseudo-elements are used to insert and style generated content.
Literal meaning: :before is used to insert content in front of the element content
.
They need to be used together with content. Using after to eliminate floats is a good choice.
Syntax: a[href]: before{content: "link"}
Note: The inserted content is before or after the content of the element, that is, inside it insert. Rather than preceding or immediately following the element