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


若要设置列之间的规则样式,请使用 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>

更新日期:24-Jun-2020

84 次浏览

开启你的 职业生涯

通过完成课程获得认证

开始
广告