如何为位于特定文本上方的空白行添加颜色？

要为位于特定文本上方的空白行添加颜色，可以使用CSS选择器和样式来实现。以下是一个示例代码，展示了如何实现这一功能：

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Colorize Empty Lines Above Text</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <p class="text">This is some text.</p>
        <p class="empty-line"></p>
        <p class="text">This is some more text.</p>
    </div>
</body>
</html>

CSS (styles.css)

.container {
    width: 300px;
    margin: 0 auto;
}

.text {
    margin: 10px 0;
}

.empty-line {
    height: 20px; /* Adjust the height as needed */
    background-color: lightblue; /* Adjust the color as needed */
}