::before 伪元素是生成的内容元素，它在内容之前添加任何类型的元素。
它可用于插入任何类型的内容，包括字符、文本字符串和图像。
该值由内容属性定义。
默认情况下，::before 伪元素是内联的。
这个伪元素可以像任何其他内容一样进行动画、定位或者浮动。
::before 伪元素也可以与一个冒号符号 :before 一起使用，所有浏览器都支持它。
::after 伪类在任何其他内容之后添加内容，而 ::before 伪元素在 HTML 中的任何其他内容之前添加内容。
使用 ::after 和 ::before 创建的伪元素不适用于替换元素（例如，<br>、<img>）。
语法
::before {
css declarations;
}
::before 伪元素的示例：
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
p::before {
content: " mysql>";
}
</style>
</head>
<body>
<h2>::before 选择器示例</h2>
<p> select * from onitroadblog</p>
</body>
</html>
在以下示例中，用户可以向内容添加样式。
带有样式内容的 ::before 伪元素示例：
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
p::before {
content: "马云-";
background-color: #ccc;
color: #666;
border: 2px dotted #000;
}
</style>
</head>
<body>
<h2>::before 选择器示例</h2>
<p>今天很残酷，明天很残酷，后天很美好。</p>
</body>
</html>
日期：2020-06-02 22:14:16 来源：oir作者：oir