理解度チェック(HTML/CSS編)
Progateでの学習内容の理解度をチェックしてみましょう。 以下のクイズに挑戦して、基本的な概念が身についているか確認してください。
tip
このクイズは学習の振り返りとして活用してください。 間違えても気にする必要はありません。 分からない部分があれば、自分なりに調べてみて理解を深めてみてください
Web開発の基礎知識クイズ
HTML/CSSの基礎的な概念について確認してみましょう。
問題 1
HTMLの見出しタグについて正しい説明はどれ?
問題 2
aタグに関する正しい説明はどれ?
問題 3
画像を埋め込むための正しいタグは次のうちどれ?
問題 4
リストを作成するときに用いる正しいタグはどれ?
問題 5
HTML文書の基本構成として正しい組み方はどれ?
問題 6
headタグ内に記載するtitleタグの主な役割は?
問題 7
<link rel="stylesheet" href="stylesheet.css"> のように書く理由は?
問題 8
ブロック要素とインライン要素の違いで正しいものは?
問題 9
ボックスモデルに関する正しい説明はどれ?
問題 10
1行テキストの入力はinput要素、複数行の入力はtextarea要素である理由は?
問題 11
inline-block要素の特徴として正しいものは?
問題 12
font-awesomeを使う目的として正しいものは?
問題 13
CSSで文字色を変更する方法として正しいものは?
問題 14
CSSで文字の大きさを変更するには何を使う?
問題 15
CSSで文字のフォントを変更するにはどのプロパティ?
問題 16
CSSで要素の幅を指定するプロパティはどれ?
問題 17
CSSで要素の背景色を変更するには何を使う?
問題 18
CSSにはタグやクラスなどのセレクタがあるが正しい説明は?
問題 19
リスト表示の際にデフォルトで表示される・(ドット)を消すには?
問題 20
floatプロパティの用途として正しいものは?
問題 21
paddingプロパティの正しい役割はどれ?
問題 22
marginプロパティの正しい役割はどれ?
問題 23
複数のセレクタを重ねて書くと何ができる? (例: .container li span {})
問題 24
セレクタをカンマ区切りで指定する例 (input, textarea {}) のメリットは?
問題 25
borderプロパティでできることとして正しいものは?
問題 26
margin: 0 auto; を指定すると何が起きる?
問題 27
background-imageプロパティを使うと何ができる?
問題 28
opacityプロパティは何を指定する?
問題 29
letter-spacingプロパティの役割は?
問題 30
:hover セレクタに関して正しい説明は?
問題 31
border-radiusプロパティの役割はどれ?
問題 32
text-align プロパティの説明として正しいものは?
問題 33
margin: 0 auto; と text-align: center; の違いは?
問題 34
色を指定する方法として正しい組み合わせは?
問題 35
rgba を使うと何ができる?
問題 36
transitionプロパティを用いると何ができる?
問題 37
line-heightプロパティはどんなときに使う?
問題 38
font-weightプロパティの説明として正しいものは?
問題 39
親要素にposition: relative; 子要素にposition: absolute; を指定すると?
問題 40
box-shadowプロパティを使うと何ができる?
問題 41
cursorプロパティの用途として正しいものは?
問題 42
:active セレクタで指定できるのはどんな状態?
問題 43
CSSプロパティの値にnoneを指定すると何が起こる?
問題 44
position: fixed; を指定すると?
問題 45
z-indexプロパティは何を制御する?
問題 46
メディアクエリを使用すると何が可能?
問題 47
メディアクエリを適用するために必要な設定は?
問題 48
display: none を活用すると?
問題 49
display: flex を使うとどのようなレイアウトが可能?
問題 50
display: flex とメディアクエリを組み合わせると何ができる?
note
クイズの内容は定期的に更新されます。 新しい問題が追加されたら、ぜひチャレンジしてみてください!