出題職人
新着
人気
ログイン
新規登録
新着クイズ
人気クイズ
ログイン
新規登録
CSS Flexbox レイアウトクイズ
00:00
1
/
10
1
第1問
どのCSSプロパティを親要素に適用すると、その子要素がFlexアイテムとして配置されるようになりますか?
A
display: block;
B
display: inline;
C
display: flex;
D
display: grid;
次へ
2
第2問
Flexboxにおいて、flex-direction: row;が設定されている場合、メイン軸(main axis)はどの方向になりますか?
A
垂直方向
B
水平方向
C
Z軸方向
D
斜め方向
前へ
次へ
3
第3問
Flexコンテナ内でFlexアイテムをメイン軸に沿って配置し、最初のアイテムは開始位置に、最後のアイテムは終了位置に配置し、残りのスペースをアイテム間に均等に分配するCSSプロパティと値の組み合わせはどれですか?
A
justify-content: center;
B
justify-content: space-between;
C
justify-content: space-around;
D
justify-content: flex-end;
前へ
次へ
4
第4問
Flexコンテナ内でFlexアイテムをクロス軸の中央に揃えるためのCSSプロパティと値の組み合わせはどれですか?
A
justify-content: center;
B
align-items: center;
C
align-self: center;
D
flex-direction: center;
前へ
次へ
5
第5問
Flexアイテムが利用可能なスペースをどのように占有するかを決定するプロパティで、デフォルト値が0であるものはどれですか?
A
flex-shrink
B
flex-basis
C
flex-grow
D
order
前へ
次へ
6
第6問
FlexアイテムがFlexコンテナのスペースが不足している場合に、どの程度縮小するかを定義するプロパティはどれですか?
A
flex-grow
B
flex-basis
C
flex-shrink
D
order
前へ
次へ
7
第7問
Flexアイテムの初期サイズを定義するプロパティで、余剰スペースが分配される前の基準となるサイズを設定するものはどれですか?
A
width
B
height
C
flex-basis
D
min-width
前へ
次へ
8
第8問
Flexアイテムの視覚的な表示順序を変更するために使用されるプロパティはどれですか?
A
z-index
B
position
C
float
D
order
前へ
次へ
9
第9問
flex: 1 1 auto;というCSS宣言は、どの3つのFlexboxプロパティのショートハンドですか?
A
flex-direction, flex-wrap, flex-flow
B
flex-grow, flex-shrink, flex-basis
C
justify-content, align-items, align-content
D
order, align-self, margin
前へ
次へ
10
第10問
flexコンテナ内で、flexアイテムが複数行に折り返すかどうかを制御するCSSプロパティは何ですか?
A
flex-direction
B
flex-wrap
C
align-items
D
justify-content
前へ
結果を見る!
中断する