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

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

値autoのmarginプロパティは、要素をコンテナ内で水平方向に中央揃えするために使用されます。次のコードを実行して、marginを実装することができます：auto;

例 

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 200px;
            margin: auto;
            border: 2px dashed blue;
         }
      </style>
   </head>
   <body>
      <p>This is demo text</p>
      <div>
         This is horizontally centered because it has margin: auto;
      </div>
   </body>
</html>

出力

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


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

    値inheritを持つmarginプロパティは、親要素から要素を継承するために使用されます。次のコードを実行して、 margin：inherit;を実装してみてください。 例 <!DOCTYPE html> <html>    <head>       <style>          div {             border: 2px solid blue;   &n

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

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