css3 选择器

类选择器 id选择器 元素选择器 伪类选择器 属性选择器 结构性选择器

逗号分隔的是或选择   空格分隔的是 层级选择  >分隔是父子级 + 紧挨着下个的兄弟元素

属性选择器 *[attr] 选择包含有attr属性的所有元素  [attr='val'] 选择包含有attr属性并且其属性值为val的所有元素 [attr~='val'] 选择包含有attr属性并且其属性值为列表类型 列表其值中有为val的所有元素 [attr|='val'] 只选择其attr属性值为val 或val-开头的元素 [attr^='val'] 只选择其attr属性值为以val 开头的元素 [attr¥='val'] 只选择其attr属性值为以val 结尾的元素 [attr*='val'] 只选择其attr属性值为包含val 值的元素

伪类选择器 lv ha  :link :visited  :hover :active lv只能用于a标签 并且只能color bgc  border-color css属性  ha可以用于任何元素

表单伪类 ::enabled  :disable  :checked  :focus

结构性选择器::nth-child(index) :first-child  :last-child  :nth-of-type(index) index从1开始 

#wrapper li:not(:last-of-type){border:1px solid red} 最后一个li不需要边框    div:empty div元素中有没有任何元素和内容(空字符串内容)

#div1::before{content:"",display:block} #div1::after{}  #div1::first-letter{font-size:18px} ::first-line 

#div1::selection{
color:red
}

box-sizing: border-box;  其元素的width:border+padding+content   height:border+padding+content

posted @ 2019-11-05 09:48  howhy  阅读(93)  评论(0编辑  收藏  举报