要素の大きさを指定するプロパティ
要素の大きさを指定するとWebサイトのレイアウト調整をしやすくなります。
半面レスポンシブ対応する場合、邪魔になることもあります。
細かいことは置いておいてまずは指定方法を紹介しておきます
要素の幅を指定するwidth
widthプロパティを使うと要素に横幅の指定をすることができます。
「ウィドス」という人もいれば「ウィズ」や「ワイドス」という人もいます。呼び方はご自由に。
プロパティ値の指定方法には、実数値にpxなどの単位をつけて指定する方法と、親要素に対する割合を%で指定する方法と、 状況に応じて大きさが設定されるautoを指定する方法があります。
※ widthプロパティにマイナスの値は指定できません。
1 2 3 4 5 |
h1{ width:100px;/*ピクセル指定*/ width:100%;/*%指定*/ width:auto;/*デフォルト値*/ } |
要素の幅を指定するheight
heightプロパティを使えば要素の高さの指定ができます。
読み方は「ハイト」とよく読まれています。「ヘイト」と読んでしまうとあまりいい言葉ではないと思うのでできれば「ハイト」と読んであげてください。
widthと同じようにプロパティ値には「px」「%」「auto」等の値が設定できる。
※ heightにもマイナスの値は設定できないはず。
1 2 3 4 5 |
h1{ height:100px;/*ピクセル指定*/ height:100%;/*%指定*/ height:auto;/*デフォルト値*/ } |