一、属性选择器
基本语法：
[属性名]{} 选择含有指定属性的元素
[属性名=属性值]{} 选择含有指定属性和属性值的元素
[属性名^=属性值]{} 选择属性值以指定值开头的元
[属性名$=属性值]{} 选择属性值以指定值结尾的元
[属性名*=属性值]{} 选择属性值含有某值的元素
例如：
</style> <body> <h1 title="abc">《静夜思》</h1> <h3 title="acde">唐·李白</h2> <p title="dbac">床前明月光，</p> <p title="abcab">疑是地上霜。</p> <p>举头望明月，</p> <p>低头思故乡。</p> </body>
1.将含有title属性标签，变成红色
<style> [title]{ color: red; } </style>
2.将含有title属性标签，属性值为“abc”，变成绿色
<style> [title=abc]{ color: green; } </style>
3.将含有title属性标签，属性值开头为“d”,变成橘色
<style> [title^="d"]{ color: orange; } </style>
4.将含有title属性标签，属性值结尾为“e”,变成粉色
<style> [title$="e"]{ color: pink; } </style>
5.将含有title属性标签，含有属性值“ca”,变成黄色
<style> [title*="ca"]{ color: yellow; } </style>
整体展示效果：
二、a元素伪类
下面案例为例：
<body> <a href="https://www.jd.com/">京东</a> <a href="https://www.taobao.com/">淘宝</a> <a href="https://www.baidu.com/">百度</a> </body> <style> a{text-decoration: none;} /*去除超链接的下划线*/ </style>
1.设置没有访问的超链接颜色为红色
我们需要使用link 来表示没有访问过的链接
<style> a:link { color: red; } </style>
2.访问过的超链接字体变成绿色
需要使用visited 来表示访问后的颜色（visited只能改变颜色）
<style> a:visited { color: green; } </style>
效果展示：
3.鼠标移入链接字体背景变成橘色
需要使用hover来改变背景颜色
<style> a:hover { background-color: orange; } </style>
4.鼠标点击后链接字体变大，颜色为黑色
需要使用active来改变鼠标点击后的状态
<style> a:active{ font-size: 30px; color: black; } </style>
效果展示：
注意事项：a伪类中，link和visited只能用于超链接，hover和active伪类可以用在所有标签。
