html之CSS设计（CSS伪类、优先级、字体属性、背景属性）_css before 背景色遮住了文字-优快云博客

文章目录

本篇文本主要介绍html编程中的CSS伪类、优先级、字体属性、背景属性，前两种是CSS选择器方面，后两类是编辑方面，本篇文章之后的内容也主要是CSS设计的编辑方面

一、CSS伪类

1、属性用法

点击过后：a:link {color: #FF0000}
初始状态：a:visited {color: #00FF00}
鼠标移动到链接上：a:hover {color: #FF00FF}
点击瞬间a:active {color: #0000FF}
在某个标签元素之前插入内容：

.add:before{
   
        content:" 欢迎访问！";
        color:red;
    }

在某个标签元素之后插入内容：

.add:after{
   
        content:" 欢迎下次访问！";
        color:blue;
    }

2、测试代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
    a:link{
   
        color: red;
    }
    a:visited {
   
        color: blue;
    }
    a:hover {
   
        color: green;
    }
    a:active {
   
        color: yellow;
    }

    .test:hover{
   
        background:chartreuse;
    }

    .top, .bottom{