2021/2/18 HTML&CSS辞典をオープンしました! コンテンツは随時更新します!

[CSS] margin系統のプロパティでボックスのマージン幅を指定しよう!

margin系統の評価
頻出度
(5.0)
重要度
(5.0)
総合評価
(5.0)




1.margin系統とは?

margin系統のプロパティはボックスの外側の余白の幅を指定します。

それぞれ上辺、右辺、下辺、左辺に対応しています。

値の指定方法は以下の通りです。

{ margin-top: 値; }

{ margin-right: 値; }

{ margin-bottom: 値; }

{ margin-left: 値; }

値の指定方法

  • auto
  • 任意の数値+単位
  • %値
注意点

負の値を指定することも可能です。

負の値を指定することで、複数の領域を重ねて表示させることができますが、重なり順や重ね位置がWebブラウザによって異なるため、指定する際は注意しましょう!




2.margin系統の使い方

それではmargin系統の使い方をみていきましょう。

.box-example01 {
 margin-top: 15px;
}

他にも値を設定できるのでいろいろと試してみることをお勧めします!




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です