CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSを使用して列間のルールの幅を設定します

column-rule-widthを使用します 列間のルールの幅を設定するプロパティ。

例

次のコードを実行して、column-rule-widthプロパティを実装してみてください。

<!DOCTYPE html>
<html>
   <head>
      <style>
         .demo {
            column-count: 4;
            column-gap: 50px;
            column-rule-color: maroon;
            column-rule-style: dashed;
            column-rule-width: 5px;
         }
      </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>

  1. CSSを使用して左の境界線の幅を設定します

    左の境界線の幅を設定するには、 border-left-widthを使用します CSSのプロパティ。次のコードを実行して、 border-left-widthを実装してみてください。 プロパティ- 例 <!DOCTYPE html> <html>    <head>       <style>          p {             border-style: dashed; &

  2. CSSでテキスト装飾の色を設定します

    テキスト装飾の色を設定するには、text-decoration-colorプロパティ-を使用します 例 <!DOCTYPE html> <html> <head> <style> .demo {    text-decoration: overline;    text-decoration-color: yellow; } </style> </head> <body> <h1>Examination Details</h1> <p cla