属于交换选择器的都有哪些

Posted 2023-05-05

选择器共有六种类型：
1.（元素）标签选择器
2.（类）class选择器
3.id选择器
4.后代选择器
5.子代选择器
6.交集选择器

例子：
器
1、标签选择器：给所有的同种标签制定标准
语法：标签名

key:value;



实例：div

width:100px;



2、类名选择器:将标签归为一类来命名
一对多：一个类名可以多个标签使用
多对一：一个标签可以用多个类名
定义一个类名（class="类名"）
语法：.类名

key:value;



实例：.head

width:100px;



使用类名（多个类名用空格隔开）
<div class="head"></div>

<div class="类名 类名-1 类名-2"></div>

3、ID选择器：唯一性 只能给一个标签用 同种ID名只能用一次
语法：#名字

key:value;



实例：#foot

width:100px;



4、包含选择器：从父元素里面找符合标准的子孙元素
先找到父元素 再找到它的子孙元素 从中筛选出符合条件的元素
用 空格 连接
语法：.类名/标签名 .类名/标签名

key:value;



实例：div .son

width:100px;



5、子选择器：找到的只是子元素
先找到父元素 再找到它的子元素 从中筛选出符合条件的元素
语法：.类名/标签名 >.类名/标签名

key:value;



实例：.father>div

width:100px;



6、全局选择器： 通配符 * （兼容性不太好）
语法：*

key:value;



实例：*

width:100px;



7、群组选择器（节省代码）
语法：标签名,标签名

key:value;



实例：div,div

width:100px;



8、相邻选择器 :
找到指定元素的相邻的兄弟元素（只能找下方的相邻元素）
语法：.类名/标签名+.类名/标签名

key:value;



实例：.a+div

width:100px;



9、兄弟选择器 （css3）:
找到指定元素的同级的所有兄弟元素（只能找下方的同级所有兄弟元素，并且为同种标签）
语法：.类名/标签名~.类名/标签名

key:value;



实例：.a~div

width:100px;



伪类选择器
1、:hover
指的是给指定元素加上鼠标悬停状态下的样式（该元素必须有宽高）
2、:active
指的是给指定元素加上鼠标激活状态下的样式
3、:after
指的是给指定元素后面添加一个伪元素 必须携带 content："" 属性
4、：before
指的是给指定元素前面添加一个伪元素 必须携带 content: "" 属性
5、 ： focus
设置焦点（聚焦）状态
6、
（1）：first-child
指的是父元素下的第一个子元素

（2）：last-child
指的是父元素下的最后一个子元素

（3）：nth-child（n）n为几 就是第几个子元素 从前面开始指定

2n

3n

odd 奇数

even 偶数

（4）：nth-last-child（n） 从后面开始指定

（5）：only-child 只有一个子元素 需加空格

（6）：empty 没有子元素的 没有任何文本 不加空格

（7）：not（） 取反（反选）

（8）：root 根元素

（9） E：first-of-type

先找到元素E，再找到其中的第一个

（10） E：last-of-type

先找到元素E，再找到其中的最后一个

（11） E：only-of-type

先找到元素E，再找到其中的只有一个的

（12） E：nth-of-type（n）

先找到元素E，再找到其中的第n个

（13） E：nth-last-of-type（n）

先找到元素E，再找到其中倒数的第n个

（14） ：first-letter/：last-letter （：：first-letter）

第一个字符/最后一个字符

（15） ：first-line /：last-line （：：first-line）

第一个行/最后一个行

属性选择器
1、 元素[属性]
找到某个元素，并且携带这个属性
<div class></div>
<div></div>

div[class='box']
width: 200px;
height: 200px;
background: green;

// 只会给第一个设置属性

2、 元素[属性='属性值']
找到某个元素，且携带这个属性，并且属性值相等的(有且只有一个属性值)
<div class></div>
<div class="box"></div>
<div class="box box2"></div>

div[class='box']
width: 200px;
height: 200px;
background: green;

// 只会给第二个设置属性

3、 元素[属性~='属性值']
找到某个元素，且携带属性，并且属性值中包含指定的属性值
<div class="box2"></div>
<div class="box box2"></div>

div[class~='box2']
width: 300px;
height: 300px;
background: purple;

// 只要属性之中含有 box2就设置属性，给所有的div标签设置属性

4、 元素[属性|='前缀']
找到元素，并且携带属性，并且属性值要以指定的形式: '前缀-xxxx'
<div class="key box1 box2"></div>
<div class="key-box box1 box2"></div>
<div class="key-box2 box1 box2"></div>

div[class|='key']
width: 50px;
height: 50px;
background: pink;

// 只给后面两个设置属性

5、 元素[属性^='前缀']
找到元素，并且携带属性 ,并且属性值以'前缀'开头（属性中只有一个属性值）
<div class="ax"></div>
<div class="baox"></div>

div[class^='a']
width: 20px;
height: 20px;
background-color: #000;

// 只给第一个设置属性

6、元素[属性$='后缀']
找到元素，并且携带属性 ,并且属性值以'后缀'结尾
<div class="baox"></div>
<div class="axb"></div>

div[class$='b']
width: 20px;
height: 20px;
background-color: blue;

// 只给第二个设置属性

7、 元素[属性*='中间']
找到元素，并且携带属性 ,并且属性值中包含'中间'
<div class="ax"></div>
<div class="axb"></div>

div[class*='x']
width: 10px;
height: 10px;
background-color: palegreen;

// 两个都会设置属性

还有一点就是当我们写程序时，可能会遇到代码写上了，但是效果却不是我们想要的，这里就遇到了选择器权重的问题：
权重： 通配符<标签选择器<类名/伪类选择器<ID选择器<行内样式<！important
本人学识有限，如有错误，希望界内大牛可以指正，万分感谢！！！

image

©

著作权归作者所有,转载或内容合作请联系作者
点赞赚钻最高日赚数百
赞 (5)
敲键盘的那些年

小礼物走一走，来简书关注我

赞赏
下载简书，随时随地看好文
暂无评论

写评论

智慧如你，不想

发表一点想法

咩~
取消确认
推荐阅读

更多精彩内容

下载简书App

你也可以写文章赚赞赏
2016年5月Swift 2 学习 --- 117个注意事项与要点
Jenaral

App中阅读
233029h5常见的面试题
kismetajun

App中阅读
26362145面向对象的用电信息数据交换协议
庭说

App中阅读
9126613网络技术与应用
阿啊阿吖丁

App中阅读
264600css选择器的分类
败于化纤

App中阅读
8703css 伪类选择器
zhao_ran

App中阅读
67021408. 数组中的字符串匹配（难度：简单） 参考技术A 常用交换选择器有：1、标签选择器；2、类选择器；3、ID选择器；4、全局选择器；5、组合选择器；6、继承选择器；7、伪类选择器。
第一种是标签选择器，也成为元素选择器。标签选择器的基本形式如下：tagNameproperty:value，其中tagName是标签名称，property是css的属性。

第二种是类选择器 ，类选择器用来为一系列标签定义相同的呈现方式，常用的语法是 .classValueproperty:value。其中classValue是类选择器的名称，这是由css编写者自己命名。

第三种是ID选择器，ID选择器定义的是某一个特定的html元素，一个网页中只有一个标签或元素使用某一ID的属性值。ID选择器的基本语法格式如下：

#idValueproperty:value。其中idValue是ID选择器的名称，可以由CSS编写者自己编写。

第四种是全局选择器，全局选择器就是对所有的htmlz元素起作用。语法格式为： *propery:value。其中“*”表示对所有元素起作用，property表示css的属性，value表示属性值。

第五种是组合选择器，就是将多种选择器进行搭配，可以构成一种复合选择器，也称为组合选择器。

第六种是继承选择器，继承的规则是子标签在没有定义的情况下，继承父标签的选择器；当子标签重复定义了父标签的声明时，执行子标签选择器。

第七种时伪类选择器，伪类选择器主要应用在<a>标签上，它由四种状态：未访问链接（link）、已访问链接（visited）、激活链接（active）、鼠标停留在连接上(hover)。

网卡分为哪几种？

一般我们用的都是以太网卡，但还有其它一些设备也属于网卡的范畴，我就详细介绍下网卡都有哪几种：
网卡是大家常提到的一个类型设备的总称，是指安装在主机里，通过网络连接线(双绞线、光纤线缆、同轴电缆等)与网络交换机(以太网交换机、FC交换机、ISCSI交换机等)、或与其它网络设备(存储设备、服务器、工作站等)连接，从而形成一个网络的硬件设备。
　　因传输协议的不同的，网卡可分为三种，一是以太网卡，二是FC网卡，三是iSCSI网卡。
　　以太网卡：学名EthernetAdapter,传输协议为IP协议,一般通过光纤线缆或双绞线与以太网交换机连接。接口类型分为光口和电口。光口一般都是通过光纤线缆来进行数据传输，接口模块一般为SFP(传输率2Gb/s)和GBIC(1Gb/s),对应的接口为SC、ST和LC。电口目前常用接口类型为RJ45,用来与双绞线连接，也有与同轴电缆连接的接口，不过现在已经用的比较少了。
　　FC网卡：一般也叫光纤网卡，学名FibreChannelHBA。传输协议为光纤通道协议，一般通过光纤线缆与光纤通道交换机连接。接口类型分为光口和电口。光口一般都是通过光纤线缆来进行数据传输，接口模块一般为SFP(传输率2Gb/s)和GBIC(1Gb/s),对应的接口为SC和LC。电口的接口类型一般为DB9针或HSSDC。
　　ISCSI网卡：学名ISCSIHBA，传输ISCSI协议，接口类型与以太网卡相同。
　　大家说的“光纤网卡”一般是指FCHBA卡，插在服务器上，外接存储用的光纤交换机;而光口的以太网卡一般都叫做“光纤以太网卡”，也是插在服务器上，不过它外接的是带光口的以太网交换机。

　回答完毕！请采纳！ 参考技术A 物理上分：有线、无线

有线：百兆网卡、千兆网卡、（1394火线卡）

无线：无线WIFI、无线2G(CDMA)、无线3G

无线3G：电信CDMA2000、移动TD-CDMA、联通WCDMA

无线2G：联通CDMA*1X 参考技术B 首先要知道网卡在电脑硬件里属于那部门的功能:

网卡是用来电脑连接网络所用的
没分什么那几种

非的要分类可以勉强的分
有线网卡和无线网卡,无线网卡要分
广域网的无线和局域网的无线网卡;

电信????????诶
那是什么东西啊

那是属于网络商``
电信,网通,联通,铁通等等很多的
通过网络商让你的电脑实现连接广域网络