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

CSSを使用して値を継承するmarginプロパティの役割

値inheritを持つmarginプロパティは、親要素から要素を継承するために使用されます。次のコードを実行して、 margin：inherit;を実装してみてください。

例

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            border: 2px solid blue;
            margin-left: 50px;
         }
         p.ex1 {
            margin-left: inherit;
         }
      </style>
   </head>
   <body>
      <p>Inheriting left margin from the parent element</p>
      <div>
         <p class = "ex1">This is demo text with inherited left margin.</p>
      </div>
   </body>
</html>

出力

CSSを使用して値を継承するmarginプロパティの役割


  1. CSSを使用した値autoによるmarginプロパティの役割

    値autoのmarginプロパティは、要素をコンテナ内で水平方向に中央揃えするために使用されます。次のコードを実行して、marginを実装することができます：auto; 例 <!DOCTYPE html> <html>    <head>       <style>          div {             width: 200px;     &nbs

  2. CSSのmarginプロパティを使用した中央揃え

    CSSのmarginプロパティを使用して、ブロックレベルの要素を水平方向に中央揃えできますが、その要素のCSSwidthプロパティを設定する必要があります。 CSSマージンプロパティを使用して要素を中央に配置する例を見てみましょう- 例 <!DOCTYPE html> <html> <head> <title>Center Alignment using CSS Margin</title> <style> #yinyangSymbol {    width: 100px;