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

CSSの変数

CSSの変数は、Webページにカスタムプロパティ値を追加するために使用されます。プロパティのカスタム名を設定し、その値を設定します。

次のコードを実行して、CSSに変数を実装し、背景とテキストの色を変更することができます

例

<!DOCTYPE html>
<html>
   <head>
      <style>
         :root {
            --my-bg-color: blue;
            --my-color: white;
         }
         #demo {
            background-color: var(--my-bg-color);
            color: var(--my-color);
         }
      </style>
   </head>
   <body>
      <h1>Heading One</h1>
      <div id = "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.
      </div>
      <br>
   </body>
</html>

  1. CSSの権利プロパティ

    rightプロパティは、要素の水平位置を設定するために使用されます。 −として設定されます right: auto|length|initial|inherit; 例 CSSで適切なプロパティを実装する例を見てみましょう- <!DOCTYPE html> <html> <head> <style> div {    text-align: justify;    text-justify: inter-word;    color: white;    backgr

  2. CSSを使用したテキストのインデント

    テキストのインデントには、CSSのtext-indentプロパティを使用します。これは、段落の最初の行をインデントするためのものです。 例 例を見てみましょう- <!DOCTYPE html> <html> <head> <style> div {    text-indent: 30px; } </style> </head> <body> <h1>Demo Heading</h1> <div> <p>This is demo text.