横幅と縦幅の値で要素のサイズを決定します。

要素を選択してトップバーでサイズを設定します。


STUDIOではいくつかの異なったサイズの単位があります。

●ピクセル(PX)

ピクセルサイズは固定の単位です。 横幅がピクセルに設定されていると、ページや画面のサイズに関係なく、その要素のサイズが変わることはありません。

●パーセント(%)

パーセント(%)は、親ボックスまたはページサイズに関係する要素のサイズです。パーセントを使用する場合、要素とページまたはコンテナボックスとの比率は、ページの縮小と合わせて変化します。

●オート(Auto)

横幅または縦幅をオートに設定すると、要素のサイズは自動的に設定されます。

要素の境界線をダブルクリックするか、要素を選択してトップバーから”auto”を選択すると、横幅と縦幅は自動に設定されます。

親ボックスの縦幅は基本的にautoに設定することをお勧めします。

●フレックス(flex)

姉妹要素がいくつも並ぶ場合に、親ボックスの幅をどんな比率で満たすかを指定する単位です。

例えば3つ横並びの姉妹ボックスの横幅をそれぞれflexで2、1、1と指定すると、以下の例のように、3つの要素が2:1:1の比率で表示されます。

フレックスを使用すると、複雑なレイアウトをすばやく作成することができます。以下のような横幅が異なる写真のギャラリーの作成に便利です。

●vh

縦幅の単位を「vh」に指定すると、スクリーンのサイズに対する比率で高さを定義します。

高さが親ボックスに左右されないので、どんなスクリーンサイズでもページいっぱいに表示する設定が可能になります。

width heights 高さ 横幅 縦幅 unit

回答が見つかりましたか?