使用 CSS 设置列间规则的样式

cssweb developmentfront end technology更新于 2024/8/25 11:56:17

要设置列间规则的样式,请使用 column-rule-style 属性。您可以尝试运行以下代码来实现 column-rule-style 属性。

示例

<!DOCTYPE html>
<html>
   <head>
      <style>
         .demo {
            column-count: 4;
            column-gap: 50px;
            column-rule-color: maroon;
            column-rule-style: dashed;
         }
      </style>
   </head>
   <body>
      <div class = "demo">
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
         This is demo text. This is demo text. This is demo text. This is demo text.
      </div>
   </body>
</html>

相关文章


有用资源