今天我们来给大家说一下属性选择器和伪类选择器的使用方法和相关的联系以及区别，下面给大家举一个小列子。
属性选择器：
[attr~="value"] 单词 单词空格单词 单词必须value有效
[attr|="value"] value打头 或者 value-单词
注意：
属性选择 都是用则很难规则表达式来判别 选择元素，效率要高一些
伪类选择器：
：before
：after
:lang(val) val/val-单词
：nth-child(n) n从1开始算起 odd基数 even偶数
:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link href="css/index.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!--
<p>aaaaaaa</p>
<p>aaaaaaa</p>
<p>aaaaaaa</p>
--->
<div>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
</div>
</body>
</html>
Css部分：
@charset "utf-8";
/* CSS Document */
/*
p:before{
content:"ccc";
}
p:lang(en){
border:1px solid #ff0000;
}
p:nth-child(even){
background:#F00;
}
*/
p:nth-of-type(3){ /* p标记的父元素 下的 第3个p元素*/
background:#F00;
}相关阅读：
Atas ialah kandungan terperinci 属性选择器和伪类选择器的使用方法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Pengenalan kepada atribut tag artikel
Apakah itu Bitcoin ETF?
webstorm ditukar kepada versi Cina
Bagaimana untuk mengulas kod dalam html
Bagaimana untuk menutup port 135 445
Bagaimana untuk menyelesaikan ralat dalam skrip halaman semasa
Bagaimana untuk menyemak penggunaan memori jvm
Pengenalan kepada Dokumen dalam JS
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
