- Q1
HTMLとは何の略ですか？
ANSWERHyperText Markup Languageクリックして解説を表示EXPLANATIONHTMLは「HyperText Markup Language」の略で、Webページの構造を記述するためのマークアップ言語です。
- Q2
HTMLタグの基本的な構造はどれですか？
ANSWER<タグ名>内容</タグ名>クリックして解説を表示EXPLANATIONHTMLタグは
<タグ名>内容</タグ名>の形式で、開始タグと終了タグで内容を囲みます。終了タグには/が付きます。 - Q3
HTML文書の最初に記述すべき宣言はどれですか？
ANSWER<!DOCTYPE html>クリックして解説を表示EXPLANATION<!DOCTYPE html>はHTML5文書であることをブラウザに伝える宣言です。文書の一番最初に記述します。 - Q4
HTMLの
<head>タグ内に記述するものとして適切なのはどれですか？ANSWERページのタイトルやメタ情報クリックして解説を表示EXPLANATION<head>タグ内にはページのメタ情報（タイトル、文字コード、CSS読み込みなど）を記述します。本文は<body>に書きます。 - Q5
ページのタイトルを設定するHTMLタグはどれですか？
ANSWER<title>クリックして解説を表示EXPLANATION<title>タグはブラウザのタブに表示されるページタイトルを設定します。<head>内に記述します。 - Q6
最も大きな見出しを表すHTMLタグはどれですか？
ANSWER<h1>クリックして解説を表示EXPLANATION見出しタグは
<h1>から<h6>まであり、<h1>が最も大きく重要な見出しを表します。 - Q7
段落を表すHTMLタグはどれですか？
ANSWER<p>クリックして解説を表示EXPLANATION<p>タグ（paragraph）は段落を表します。テキストを段落としてまとめるときに使用します。 - Q8
改行を挿入するHTMLタグはどれですか？
ANSWER<br>クリックして解説を表示EXPLANATION<br>タグ（break）は改行を挿入します。終了タグは不要な空要素です。 - Q9
リンクを作成するHTMLタグはどれですか？
ANSWER<a>クリックして解説を表示EXPLANATION<a>タグ（anchor）はハイパーリンクを作成します。href属性でリンク先URLを指定します。 - Q10
次のコードでリンク先を指定する属性はどれですか？
<a href="https://example.com">リンク</a>ANSWERhrefクリックして解説を表示EXPLANATIONhref属性（Hypertext REFerence）はリンク先のURLを指定します。
- Q11
画像を表示するHTMLタグはどれですか？
ANSWER<img>クリックして解説を表示EXPLANATION<img>タグは画像を表示します。src属性で画像ファイルのパスを指定します。終了タグは不要です。 - Q12
<img>タグで画像ファイルのパスを指定する属性はどれですか？ANSWERsrcクリックして解説を表示EXPLANATIONsrc属性（source）は画像ファイルのパスやURLを指定します。 - Q13
<img>タグのalt属性は何のために使いますか？ANSWER画像が表示できない場合の代替テキストクリックして解説を表示EXPLANATIONalt属性は画像が表示できない場合の代替テキストを指定します。アクセシビリティやSEOにも重要です。 - Q14
番号なしリスト（箇条書き）を作成するHTMLタグはどれですか？
ANSWER<ul>クリックして解説を表示EXPLANATION<ul>タグ（Unordered List）は番号なしの箇条書きリストを作成します。各項目は<li>タグで囲みます。 - Q15
番号付きリストを作成するHTMLタグはどれですか？
ANSWER<ol>クリックして解説を表示EXPLANATION<ol>タグ（Ordered List）は番号付きのリストを作成します。各項目は<li>タグで囲みます。 - Q16
リストの各項目を表すHTMLタグはどれですか？
ANSWER<li>クリックして解説を表示EXPLANATION<li>タグ（List Item）はリストの各項目を表します。<ul>や<ol>の中で使用します。 - Q17
テーブル（表）を作成するHTMLタグはどれですか？
ANSWER<table>クリックして解説を表示EXPLANATION<table>タグはテーブル（表）を作成します。行は<tr>、セルは<td>や<th>で定義します。 - Q18
テーブルの行を表すHTMLタグはどれですか？
ANSWER<tr>クリックして解説を表示EXPLANATION<tr>タグ（Table Row）はテーブルの行を表します。 - Q19
テーブルのデータセルを表すHTMLタグはどれですか？
ANSWER<td>クリックして解説を表示EXPLANATION<td>タグ（Table Data）はテーブルのデータセルを表します。 - Q20
テーブルのヘッダーセルを表すHTMLタグはどれですか？
ANSWER<th>クリックして解説を表示EXPLANATION<th>タグ（Table Header）はテーブルのヘッダーセルを表します。通常、太字で中央揃えになります。
- Q21
フォームを作成するHTMLタグはどれですか？
ANSWER<form>クリックして解説を表示EXPLANATION<form>タグはユーザー入力を受け付けるフォームを作成します。 - Q22
テキスト入力欄を作成するHTMLタグはどれですか？
ANSWER<input>クリックして解説を表示EXPLANATION<input>タグでテキスト入力欄を作成できます。type="text"がデフォルトです。 - Q23
パスワード入力欄を作成するには、
<input>タグのtype属性に何を指定しますか？ANSWERtype="password"クリックして解説を表示EXPLANATIONtype="password"を指定すると、入力した文字が●や＊で隠されるパスワード入力欄になります。 - Q24
送信ボタンを作成するには、
<input>タグのtype属性に何を指定しますか？ANSWERtype="submit"クリックして解説を表示EXPLANATIONtype="submit"を指定すると、フォームを送信するボタンになります。 - Q25
複数行のテキスト入力欄を作成するHTMLタグはどれですか？
ANSWER<textarea>クリックして解説を表示EXPLANATION<textarea>タグは複数行のテキスト入力欄を作成します。<input type="text">は1行のみです。 - Q26
ドロップダウンリスト（選択リスト）を作成するHTMLタグはどれですか？
ANSWER<select>クリックして解説を表示EXPLANATION<select>タグはドロップダウンリストを作成します。選択肢は<option>タグで定義します。 - Q27
チェックボックスを作成するには、
<input>タグのtype属性に何を指定しますか？ANSWERtype="checkbox"クリックして解説を表示EXPLANATIONtype="checkbox"を指定すると、チェックボックスになります。複数選択が可能です。 - Q28
ラジオボタンを作成するには、
<input>タグのtype属性に何を指定しますか？ANSWERtype="radio"クリックして解説を表示EXPLANATIONtype="radio"を指定すると、ラジオボタンになります。同じname属性のグループから1つだけ選択できます。 - Q29
フォーム部品にラベルを付けるHTMLタグはどれですか？
ANSWER<label>クリックして解説を表示EXPLANATION<label>タグはフォーム部品にラベル（説明文）を付けます。for属性で関連付けるとクリックで入力欄にフォーカスできます。 - Q30
汎用的なブロック要素を作成するHTMLタグはどれですか？
ANSWER<div>クリックして解説を表示EXPLANATION<div>タグは汎用的なブロック要素（コンテナ）です。グループ化やレイアウトの基盤として使用します。
- Q31
汎用的なインライン要素を作成するHTMLタグはどれですか？
ANSWER<span>クリックして解説を表示EXPLANATION<span>タグは汎用的なインライン要素です。テキストの一部にスタイルを適用する際などに使用します。 - Q32
ブロック要素とインライン要素の違いは何ですか？
ANSWERブロック要素は改行され、インライン要素は改行されないクリックして解説を表示EXPLANATIONブロック要素は前後に改行が入り横幅いっぱいに広がります。インライン要素は改行されず、内容の幅だけを占めます。
- Q33
HTMLコメントの正しい書き方はどれですか？
ANSWER<!-- コメント -->クリックして解説を表示EXPLANATIONHTMLのコメントは
<!-- コメント -->の形式で書きます。ブラウザには表示されません。 - Q34
CSSとは何の略ですか？
ANSWERCascading Style Sheetsクリックして解説を表示EXPLANATIONCSSは「Cascading Style Sheets」の略で、HTMLの見た目（スタイル）を定義するための言語です。
- Q35
HTMLファイルに外部CSSファイルを読み込むタグはどれですか？
ANSWER<link>クリックして解説を表示EXPLANATION<link>タグで外部CSSファイルを読み込みます。rel="stylesheet"とhref属性でファイルを指定します。 - Q36
HTML内に直接CSSを記述するタグはどれですか？
ANSWER<style>クリックして解説を表示EXPLANATION<style>タグ内にCSSを直接記述できます。通常は<head>内に配置します。 - Q37
CSSのインラインスタイルはどのように書きますか？
ANSWERstyle属性に記述するクリックして解説を表示EXPLANATIONインラインスタイルは要素の
style属性に直接CSSを記述します。例：<p style="color: red;"> - Q38
CSSの基本的な構文はどれですか？
ANSWERセレクタ { プロパティ: 値; }クリックして解説を表示EXPLANATIONCSSは
セレクタ { プロパティ: 値; }の形式で記述します。セレクタで対象を指定し、プロパティで何を、値でどのようにするかを指定します。 - Q39
要素名（タグ名）でスタイルを適用するCSSセレクタの書き方はどれですか？
ANSWERpクリックして解説を表示EXPLANATION要素セレクタは要素名をそのまま書きます。例：
p { color: red; }はすべての<p>タグに適用されます。 - Q40
クラスセレクタの書き方はどれですか？
ANSWER.クラス名クリックして解説を表示EXPLANATIONクラスセレクタは
.クラス名の形式で書きます。例：.highlight { color: yellow; }
- Q41
IDセレクタの書き方はどれですか？
ANSWER#ID名クリックして解説を表示EXPLANATIONIDセレクタは
#ID名の形式で書きます。例：#header { background: blue; }。IDはページ内で一意である必要があります。 - Q42
すべての要素に適用するユニバーサルセレクタはどれですか？
ANSWERクリックして解説を表示EXPLANATION*（アスタリスク）はユニバーサルセレクタで、すべての要素に適用されます。 - Q43
文字の色を指定するCSSプロパティはどれですか？
ANSWERcolorクリックして解説を表示EXPLANATIONcolorプロパティは文字（テキスト）の色を指定します。 - Q44
背景色を指定するCSSプロパティはどれですか？
ANSWERbackground-colorクリックして解説を表示EXPLANATIONbackground-colorプロパティは要素の背景色を指定します。 - Q45
CSSで色を指定する方法として正しくないものはどれですか？
ANSWERcolor(255, 0, 0)クリックして解説を表示EXPLANATIONCSSでは色名（red）、16進数（#ff0000）、RGB（rgb(255,0,0)）などで色を指定できます。
color()という関数は標準ではありません。 - Q46
フォントサイズを指定するCSSプロパティはどれですか？
ANSWERfont-sizeクリックして解説を表示EXPLANATIONfont-sizeプロパティは文字の大きさを指定します。 - Q47
フォントの種類を指定するCSSプロパティはどれですか？
ANSWERfont-familyクリックして解説を表示EXPLANATIONfont-familyプロパティはフォントの種類（書体）を指定します。 - Q48
文字を太字にするCSSプロパティと値はどれですか？
ANSWERfont-weight: bold;クリックして解説を表示EXPLANATIONfont-weight: bold;で文字を太字にできます。数値（700など）でも指定できます。 - Q49
文字を斜体にするCSSプロパティと値はどれですか？
ANSWERfont-style: italic;クリックして解説を表示EXPLANATIONfont-style: italic;で文字を斜体にできます。 - Q50
テキストの配置を中央揃えにするCSSプロパティと値はどれですか？
ANSWERtext-align: center;クリックして解説を表示EXPLANATIONtext-align: center;でテキストを中央揃えにできます。
- Q51
テキストに下線を引くCSSプロパティと値はどれですか？
ANSWERtext-decoration: underline;クリックして解説を表示EXPLANATIONtext-decoration: underline;でテキストに下線を引けます。 - Q52
要素の幅を指定するCSSプロパティはどれですか？
ANSWERwidthクリックして解説を表示EXPLANATIONwidthプロパティは要素の幅を指定します。 - Q53
要素の高さを指定するCSSプロパティはどれですか？
ANSWERheightクリックして解説を表示EXPLANATIONheightプロパティは要素の高さを指定します。 - Q54
CSSのボックスモデルで、内容と境界線の間の余白は何と呼びますか？
ANSWERpaddingクリックして解説を表示EXPLANATIONパディング（padding）は内容と境界線（border）の間の内側の余白です。
- Q55
CSSのボックスモデルで、境界線の外側の余白は何と呼びますか？
ANSWERmarginクリックして解説を表示EXPLANATIONマージン（margin）は境界線（border）の外側の余白です。要素間の間隔を空けるのに使います。
- Q56
要素の境界線を指定するCSSプロパティはどれですか？
ANSWERborderクリックして解説を表示EXPLANATIONborderプロパティは要素の境界線（太さ、スタイル、色）を指定します。 - Q57
次のCSSで境界線はどのようになりますか？
border: 1px solid black;ANSWER1ピクセルの実線の黒い境界線クリックして解説を表示EXPLANATION1px solid blackは「1ピクセルの太さ」「実線（solid）」「黒色」の境界線を指定しています。 - Q58
要素の角を丸くするCSSプロパティはどれですか？
ANSWERborder-radiusクリックして解説を表示EXPLANATIONborder-radiusプロパティは要素の角を丸くします。値が大きいほど丸くなります。 - Q59
pxは何の単位ですか？ANSWERピクセルクリックして解説を表示EXPLANATIONpxはピクセル（pixel）の単位で、画面上の点の数を表します。絶対的なサイズ指定に使います。 - Q60
%（パーセント）は何を基準にしたサイズですか？ANSWER親要素のサイズクリックして解説を表示EXPLANATION%は親要素のサイズを基準にした相対的なサイズです。例えばwidth: 50%;は親要素の幅の半分になります。
- Q61
emは何を基準にしたサイズですか？ANSWER親要素のフォントサイズクリックして解説を表示EXPLANATIONemは親要素のフォントサイズを基準にした相対単位です。1emは親要素のフォントサイズと同じです。 - Q62
remは何を基準にしたサイズですか？ANSWERルート要素のフォントサイズクリックして解説を表示EXPLANATIONrem（root em）はルート要素（<html>）のフォントサイズを基準にした相対単位です。 - Q63
要素を画面上で非表示にするCSSプロパティと値はどれですか？
ANSWERdisplay: none;クリックして解説を表示EXPLANATIONdisplay: none;は要素を完全に非表示にし、レイアウト上のスペースも占めなくなります。 - Q64
visibility: hidden;とdisplay: none;の違いは何ですか？ANSWERvisibilityはスペースが残り、displayはスペースも消えるクリックして解説を表示EXPLANATIONvisibility: hidden;は要素を見えなくしますがスペースは残ります。display: none;はスペースごと消えます。 - Q65
リンクの下線を消すCSSはどれですか？
ANSWERtext-decoration: none;クリックして解説を表示EXPLANATIONtext-decoration: none;でテキストの装飾（下線など）を消せます。リンクの下線を消すのによく使います。 - Q66
リストのマーク（●や番号）を消すCSSはどれですか？
ANSWERlist-style: none;クリックして解説を表示EXPLANATIONlist-style: none;でリストのマーカー（●や番号）を消せます。 - Q67
マウスカーソルを指の形にするCSSはどれですか？
ANSWERcursor: pointer;クリックして解説を表示EXPLANATIONcursor: pointer;でマウスカーソルを指の形（クリック可能を示す）にできます。 - Q68
HTML5で追加された、ページのヘッダー部分を表すセマンティックタグはどれですか？
ANSWER<header>クリックして解説を表示EXPLANATION<header>タグはページやセクションのヘッダー部分を表すセマンティックタグです。 - Q69
HTML5で追加された、ページのフッター部分を表すセマンティックタグはどれですか？
ANSWER<footer>クリックして解説を表示EXPLANATION<footer>タグはページやセクションのフッター部分を表すセマンティックタグです。 - Q70
HTML5で追加された、ナビゲーション部分を表すセマンティックタグはどれですか？
ANSWER<nav>クリックして解説を表示EXPLANATION<nav>タグはナビゲーションリンクの集まりを表すセマンティックタグです。
- Q71
HTML5で追加された、独立したコンテンツを表すセマンティックタグはどれですか？
ANSWER<article>クリックして解説を表示EXPLANATION<article>タグは独立したコンテンツ（ブログ記事など）を表すセマンティックタグです。 - Q72
HTML5で追加された、ページのセクションを表すセマンティックタグはどれですか？
ANSWER<section>クリックして解説を表示EXPLANATION<section>タグはドキュメントの汎用的なセクション（章、節など）を表すセマンティックタグです。 - Q73
HTML5で追加された、補足情報を表すセマンティックタグはどれですか？
ANSWER<aside>クリックして解説を表示EXPLANATION<aside>タグは本文とは別の補足情報（サイドバーなど）を表すセマンティックタグです。 - Q74
HTMLの
<strong>タグは何を表しますか？ANSWER重要なテキスト（通常太字）クリックして解説を表示EXPLANATION<strong>タグは重要なテキストを表し、通常は太字で表示されます。意味的な強調を表します。 - Q75
HTMLの
<em>タグは何を表しますか？ANSWER強調されたテキスト（通常斜体）クリックして解説を表示EXPLANATION<em>タグは強調されたテキストを表し、通常は斜体で表示されます。 - Q76
HTMLで文字コードを指定するmetaタグの書き方はどれですか？
ANSWER<meta charset="UTF-8">クリックして解説を表示EXPLANATION<meta charset="UTF-8">で文字コードをUTF-8に指定します。日本語を正しく表示するために重要です。 - Q77
レスポンシブデザインに必要なviewportの設定はどれですか？
ANSWER<meta name="viewport" content="width=device-width, initial-scale=1.0">クリックして解説を表示EXPLANATION<meta name="viewport" content="width=device-width, initial-scale=1.0">でモバイルデバイスでの表示を最適化します。 - Q78
CSSで複数のセレクタに同じスタイルを適用する書き方はどれですか？
ANSWERh1, h2, h3 { }クリックして解説を表示EXPLANATION複数のセレクタをカンマで区切ると、同じスタイルを適用できます。例：
h1, h2, h3 { color: blue; } - Q79
CSSで子孫要素を指定するセレクタの書き方はどれですか？
ANSWERdiv pクリックして解説を表示EXPLANATION子孫セレクタは空白で区切って書きます。例：
div p { }はdivの中のpすべてに適用されます。 - Q80
CSSで直接の子要素のみを指定するセレクタの書き方はどれですか？
ANSWERdiv > pクリックして解説を表示EXPLANATION子セレクタは
>で区切ります。例：div > p { }はdivの直接の子のpのみに適用されます。
- Q81
CSSのセレクタで、IDセレクタとクラスセレクタではどちらが優先されますか？
ANSWERIDセレクタクリックして解説を表示EXPLANATIONIDセレクタはクラスセレクタより詳細度（優先度）が高いため、IDセレクタのスタイルが適用されます。
- Q82
CSSでスタイルを強制的に適用するキーワードはどれですか？
ANSWER!importantクリックして解説を表示EXPLANATION!importantを値の後に付けると、他のスタイルより優先されます。ただし多用は避けるべきです。 - Q83
背景画像を指定するCSSプロパティはどれですか？
ANSWERbackground-imageクリックして解説を表示EXPLANATIONbackground-imageプロパティで背景画像を指定します。値はurl('画像パス')の形式で書きます。 - Q84
背景画像を繰り返さないようにするCSSプロパティと値はどれですか？
ANSWERbackground-repeat: no-repeat;クリックして解説を表示EXPLANATIONbackground-repeat: no-repeat;で背景画像の繰り返しを無効にできます。 - Q85
要素の透明度を指定するCSSプロパティはどれですか？
ANSWERopacityクリックして解説を表示EXPLANATIONopacityプロパティは要素全体の透明度を指定します。0（完全に透明）から1（不透明）の値を取ります。 - Q86
行の高さ（行間）を指定するCSSプロパティはどれですか？
ANSWERline-heightクリックして解説を表示EXPLANATIONline-heightプロパティは行の高さを指定します。読みやすさに影響する重要なプロパティです。 - Q87
文字間隔を指定するCSSプロパティはどれですか？
ANSWERletter-spacingクリックして解説を表示EXPLANATIONletter-spacingプロパティは文字と文字の間隔を指定します。 - Q88
要素を横に並べるために使うCSSプロパティと値として適切なのはどれですか？
ANSWERdisplay: inline-block;クリックして解説を表示EXPLANATIONdisplay: inline-block;を使うと、要素をブロック要素の性質を保ちつつ横に並べられます。floatも使えますが、現在はflexboxが推奨されます。 - Q89
HTMLの
<a>タグで、リンクを新しいタブで開くには何を指定しますか？ANSWERtarget="_blank"クリックして解説を表示EXPLANATIONtarget="_blank"を指定すると、リンクが新しいタブ（またはウィンドウ）で開きます。 - Q90
HTMLの
<img>タグで、画像の幅を300ピクセルに指定するにはどうしますか？ANSWERwidth="300"クリックして解説を表示EXPLANATIONwidth="300"またはwidth属性で幅を指定できます。CSSで指定することも可能です。
- Q91
HTMLで特殊文字「<」を表示するにはどう書きますか？
ANSWER<クリックして解説を表示EXPLANATION<（less than）は「<」を表す文字実体参照です。HTMLタグと区別するために使います。 - Q92
HTMLで特殊文字「>」を表示するにはどう書きますか？
ANSWER>クリックして解説を表示EXPLANATION>（greater than）は「>」を表す文字実体参照です。 - Q93
HTMLで半角スペースを表示するにはどう書きますか？
ANSWERクリックして解説を表示EXPLANATION （non-breaking space）は半角スペースを表す文字実体参照です。連続したスペースを表示するのに使います。 - Q94
要素に影を付けるCSSプロパティはどれですか？
ANSWERbox-shadowクリックして解説を表示EXPLANATIONbox-shadowプロパティは要素に影を付けます。テキストの影はtext-shadowを使います。 - Q95
CSSコメントの正しい書き方はどれですか？
ANSWER/* コメント */クリックして解説を表示EXPLANATIONCSSのコメントは
/* コメント */の形式で書きます。JavaScriptと同じ形式です。 - Q96
overflow: hidden;は何をしますか？ANSWERはみ出した内容を非表示にするクリックして解説を表示EXPLANATIONoverflow: hidden;は要素の範囲からはみ出した内容を非表示にします。 - Q97
overflow: scroll;は何をしますか？ANSWERスクロールバーを表示してスクロール可能にするクリックして解説を表示EXPLANATIONoverflow: scroll;は常にスクロールバーを表示し、はみ出した内容をスクロールで見られるようにします。