CSS 又名 层叠样式表，所谓层叠，就是后面的样式会覆盖前面的样式，所以在样式表中，各样式排列的顺序很有讲究。 :link 与 :visited 在样式文件中的顺序可以随便放置。而focus， hover，active这几个，如果你设置的顺序不同，会直接影响样式的显示效果，下面会详细解释。这边我就不上代码一一例举了，我直接上一段正确的样式代码，大家可以直接去测试，变换位置去思考一下，基本就懂了，不懂的可以来找我探讨。## css<style>a:link{color:chartreuse}a:visited {color: blueviolet;}a:hover{color:aqua}button:hover {background-color:aqua;}a:focus{color:blue}button:focus {background-color:blue;}a:active{color:red}button:active {background-color:red;}</style>## html<body><div class="layui-fluid"><a href="##" style="font-size:220px;">ws </a><button class="layui-btn aa">我是按钮</button><button class="layui-btn">123</button></div></body>这边是引入的layui的css 让按钮变得好看一点。
总结：
link表示链接在正常情况下（即页面刚加载完成时）显示的颜色。
visited表示链接被点击后显示的颜色。
hover表示鼠标悬停时显示的颜色。
focus表示元素获得光标焦点时使用的颜色，主要用于文本框输入文字时使用（鼠标松开时显示的颜色）。
active表示当所指元素处于激活状态（鼠标在元素上按下还没有松开）时所显示的颜色。
#注：伪类的顺序应为link–visited–hover–focus–active。
不懂的地方可以留言交流~~
