ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

css选择器

2020-03-25 22:03:38  阅读:181  来源: 互联网

标签:标签 class 元素 id css 选择器 类名


一  css基础选择器:

1. 标签选择器

标签名/元素名{属性1;属性值1...};(div span);

2.类选择器

使用“.”进行标识,后面紧跟类名

.类名{属性1,属性值1;...}

调用的时候用class=“类名”;

3.多类选择器

多个类名中间用空格隔开;

<div class="pink fontWeight font20"></div>;

4.id 选择器

使用“#”进行标识,后面紧跟id名;

#id名{属性1:属性值1;};

 

id选择器与类选择器区别:

类选择器(class)好比人的名字,是可以多次重复使用;

id选择器好比人的身份证,全国唯一;两者最大的不同在于使用次数上;

 

通配符选择器:用“*”表示

比如清除所有HTML标识的默认边框:

* {

  margin: 0;

  padding: 0;

}

 

二 后代选择器与子元素选择器

后代选择器又称为包含选择器,用来选择元素或元素组的后代,其写法就是把外层标签写在前面,内层标签写在后面,中间用空格分隔。当标签发生嵌套时,内层标签就成为外层标签的后代。

子元素选择器只能选择作为某元素子元素的元素。其写法就是把父级标签写在前面,子级标签写在后面,中间跟一个 “>” 进行连接,注意,符号左右两侧各保留一个空格。白话: 这里的子 指的是 亲儿子 不包含孙子 重孙子之类。

三 并集选择器

并集选择器(CSS选择器分组)是各个选择器通过<strong >逗号</strong>连接而成的,任何形式的选择器(包括标签选择器、class类选择器id选择器等;

四 交集选择器

交集选择器由两个选择器构成,其中第一个为标签选择器,第二个为class选择器,两个选择器之间不能有空格,如h3.special;

五 链接伪类选择器

伪类选择器用于向某些选择器添加特殊的效果。比如给链接添加特殊效果, 比如可以选择 第1个,第n个元素。

类选择器是一个点 比如 .demo {}   而我们的伪类 用 2个点 就是 冒号  比如  :link{}。

标签:标签,class,元素,id,css,选择器,类名
来源: https://www.cnblogs.com/yjiajia/p/12562525.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有