CSS笔记（一）：CSS选择器

时间：2023-04-05 15:30:33 HTML5

一、语法规则选择器{属性1：属性值1；属性2：属性值2；......}/*评论*/2.如何在html中写应用CSS1。外部引用css文件css文件：css/layout.css（css文件夹和html在同一个目录）2．在中嵌入css3.使用

3.选择器1.基本选择器1）元素选择器adivbodyul2）类选择器.ClassName示例：.current3）ID选择器#IdName示例：#top_nav4）通用选择器*{/*css代码*/}5)andselectorselector1selector2p.one#first

6)parallelselectorp,.one,#first

2。层次选择器1）后代选择器使用空格分隔两个选择器，例如[parantson]2）子选择器使用大于号分隔两个选择器，例如[parent>son]3）下一个兄弟选择器使用+拆分两个选择器，比如[li:first-child+*]4）之后，所有的兄弟选择器用波浪线~拆分两个选择器，比如[li:first-child~*]3.属性selector(filter)配合基础选择器过滤selector[name]选择有name属性的元素，none关于这个属性的取值，selector[name=val]选择name属性值为val的元素selector[name*=val]选择name属性值为val的元素selector[name^=val]选择具有name属性且name的值以val开头的元素selector[name$=val]选择具有name属性且name的值以val结尾的元素selector[name~=val]select具有name属性且其值包含的元素val4.伪类选择器配合基本选择器进行过滤1）子元素：first-child:last-child:nth-child(n),:nth-last-child(n):first-of-type:last-of-type:nth-of-type(n),:nth-last-of-type(n)注：n可以是元素的序号或特殊字符，如"odd","even2)Status:hover,:active:,focus:enabled,:disabled;:checked,:default:invalid,:valid,:required,:optional,:in-range,:out-of-range5.伪元素选择器伪元素以“::”开头，用在选择器之后选择指定的元素::after常用于清除浮动，使浮动的子元素支持父元素。示例：

#nav::after{content="";显示=块；清除=两者；}::before::first-letter::first-line::selectiontobecontinued......