码迷,mamicode.com
首页 > Web开发 > 详细

常用CSS选择器

时间:2020-06-20 19:21:49      阅读:72      评论:0      收藏:0      [点我收藏+]

标签:let   htm   style   nbsp   定义   定义类   自定义类   结构   属性   

  1. 标签选择器
    语法:
    1. HTML标签名 {属性:值;}
  2. 类选择器
    语法:
    1. .自定义类名 {属性:值;}
  3. 后代选择器
    语法:
    1. 选择器 选择器 {属性:值;}  /*标签之间必须是嵌套关系*/
  4. 并集选择器
    语法:
    1. 选择器,选择器 {属性:值;}
  5. 伪类选择器
    语法:
    1. 类名:hover {属性:值;}  /*鼠标指针浮动样式*/
    2. 类名:link {属性:值;}  /*选择所有未被访问的链接*/
    3. 类名:visited {属性:值;}  /*选择所有已被访问的链接*/
    4. 类名:active {属性:值;}  /*选择活动链接*/
    5. 类名:focus {属性:值;}  /*选择获得焦点的 input 元素*/
    6. 类名:first-letter {属性:值;}  /*选择每个 <p> 元素的首字母*/
    7. 类名:first-line {属性:值;}  /*选择每个 <p> 元素的首行*/
    8. 类名:first-child {属性:值;}  /*选择属于父元素的第一个子元素的每个 <p> 元素*/
    9. 类名:before {属性:值;}  /*在每个 <p> 元素的内容之前插入内容*/
    10. 类名:after {属性:值;}  /*在每个 <p> 元素的内容之后插入内容*/
    11. 类名:lang(language) {属性:值;}  /*选择带有以 "it" 开头的 lang 属性值的每个 <p> 元素*/
       
  6. 结构伪类选择器
    语法:
    1. .类名 :nth-child(n) {属性:值;}  /*第n行*/
    2. .类名 :first-child {属性:值;}  /*第1行*/
    3. .类名 :last-child {属性:值;}  /*最后1行*/
    4. .类名 :nth-last-child(n) {属性:值;}  /*倒数第n行*/

 

常用CSS选择器

标签:let   htm   style   nbsp   定义   定义类   自定义类   结构   属性   

原文地址:https://www.cnblogs.com/axibug/p/13169376.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!