版权声明：本站所提供的文章资讯、软件资源、素材源码等内容均为本作者提供、网友推荐、互联网整理而来（部分报媒/平媒内容转载自网络合作媒体），仅供学习参考，如有侵犯您的版权，请联系我，本作者将在三个工作日内改正。 https://blog.csdn.net/weixin_42323802/article/details/82765805
3种基础选择器；
元素，id，类
扩展选择器；
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>3种选择器</title>
<style type="text/css">
/*使用后代选择器 父类选择器加空格
或者使用 直接后代选择器(直接后代选择器)
*/
#red > li {
color: red;
}
/*并集选择器*/
div, span, p {
color: green;
}
/*属性选择器*/
input[type="password"] {
background-color: hotpink;
}
/*伪类选择器
适用于a标签的，link ；active 等
*/
a:link {
color: red;
}
a:visited {
color: green;
}
a:hover {
color: yellow;
}
a:active {
color: antiquewhite;
}
</style>
</head>
<body>
<ul>
<li>nihao</li>
<li>nihao</li>
<li>nihao</li>
</ul>
<ul id="red">
<li>hello</li>
<li>hello</li>
<li>hello</li>
</ul>
<ol>
<li>hai</li>
<li>hai</li>
<li>hai</li>
</ol>
<!--以下是并集选择其使用的-->
<div>jiha</div>
<p>nihaoa</p>
<span>lsdhaflsd</span>
<!--下面是属性使用的-->
<br/>
用户名；<input type="text" name="username" placeholder="请输入用户名">
<br/>
密码；<input type="password" name="password" placeholder="请输入密码">
<!--定义a标签 用于伪类选择器-->
<br/>
<a href="#">点击注册</a>
<input type="text" name="username">
</body>
</html>