CSS阶段第二天

10月29日内容
一 CSS选择器
CSS找到HTML标签的方法,叫做选择器
1.基本选择器
2.层级选择器
3.属性选择器
4.伪类选择器
5.其它选择器
二 详解选择器
(一)基本选择器
1.ID选择器 在需要操作的标签中,加入id=’值/名’ 属性
在CSS中通过 #值/名{ } 选择HTML标签
Ps: 不可以起多个ID名!

2.类选择器/class选择器 在需要操作的标签中,加class=’值/名’属性
在CSS中通过 .值/名{ } 选择HTML标签
ps:可以起多个类名,不同的类名用空格去分隔

3.标签选择 通过标签名选中HTML的标签

4.通配符 可以选重所有标签 (JS中功能越强大的效率越低)

CSS权重(优先级)
权重值越高, 优先级越高, 权重值可以相加,当权重值一样时,还会采用就近原则

权得值:
ID选择器 100分
类选择器 10分
标签择器 1分
通配符 0分

二 层级选择器

空格 找到所有的后代元素

  找到子元素

•   找到目标标签后面 紧挨着的兄弟元素
  

~ 找到目标标签后面 指定的所有的兄弟元素

2 群组选择器/组合选择器 u,i,#one,.class{ }

三 属性选择
格式 选择器[属性]{ } 找到含有 “属性” 的所有标签

= input[type=’text’] 找到含有type属性且属性值为 ‘text’的标签

^(shift+6) input[type ^= ‘aa’ ] 找到含有type属性 且属性值 以’aa’开头的标签

$(shift+4) input[type $=’b’ ] 找到含有type属性 且属性值 以’b’ 结尾的标签

*(sheif+8) input[type *= ‘c’] 找到含有type属性且属性值中包含’c’的所有标签