CSS 数据类型 - <string>

CSS 数据类型<string>表示文本或字符字符串。它用于各种属性中来指定文本内容，例如伪元素 (::before 和 ::after) 上下文中 content 属性。<string> 数据类型用于插入文字文本或动态生成文本内容。

构成 <string> 数据类型的 Unicode 字符用双引号 (“”) 或单引号 (') 括起来。
几乎所有字符都有直接的表示形式。

或者，所有字符都可以用其对应的十六进制 Unicode 代码点表示，前面带有反斜杠 (\)。双引号 (\22)、单引号 (') 和版权符号 (©) 分别用 \22、\27 和 \A9 表示。
要输出换行符，请使用换行符 (\A 或 \00000A) 转义它们。如果字符串跨越多行，则字符串中每行的最后一个字符应为 \。

CSS <string> - 基本示例

以下示例演示了在 content 属性中使用 <string> 数据类型。

<html>
<head>
<style>
   body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      margin: 0;
      padding: 20px;
      background-color: #f4f4f4;
   }
   .container {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
   }
   .box {
      position: relative;
      width: 400px;
      height: 400px;
      background-color: #ed8013;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
   }
   .box::before {
      content: "\"Life\" is never 'fair', And perhaps it is good thing for most of us that it is \'not\'." " - Oscar Wilde";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 24px;
      font-weight: bold;
      color: #fff;
      text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
   }
</style>
</head>
<body>
<div class="container">
<div class="box"></div>
</div>
</body>
</html>

打印页面