demo.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/* 伪元素选择器 */
/* 第一个字母/汉字 */
li::first-letter {
color:red;
background-color: yellow;
}
div {
border: 1px solid #000;
width: 500px;
height: 500px;
}
/* 第一行 */
div::first-line {
background-color: red;
}
/* 鼠标选中区域 */
div::selection {
background-color: rgba(255,150,50,0.3);
color: blue; /* font-size、font-weight等 设置不起作用 */
}
</style>
</head>
<body>
<ul>
<li>aaaaaaaaaa</li>
<li>啊啊啊啊啊啊</li>
<li>날씨날씨날씨날씨</li>
</ul>
<div>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</div>
</body>
</html>