| 問題 | 解答（ドラッグすると解答が見える） | 備考 |
|---|---|---|
| HTMLファイルにCSSファイルへのリンクを定義せよ。 | <link rel="stylesheet" href="cssファイル名" type="text/css"> | <head></head>内に記述する。 |
| Webページ全体に適用するスタイルを定義せよ。 | <style type="text/css"><!-- セレクタ{ プロパティ : 値 }
--></style> |
<head></head>内に記述する。 |
| 特定の要素に適用するスタイルを定義せよ。 | <要素名 style="プロパティ : 値"> | { }ではなく""で囲む点に注意。 |
| 文字列の色を指定するプロパティは？ | coloｒ : カラーコードまたはカラーネーム | |
| 文字列の装飾を指定するプロパティと値を答えよ。 | text-decoration : 値 none(下線等なし) underline(下線) line-through(取り消し線) |
|
| 英字の大文字/小文字を指定するプロパティと値を答えよ。 | text-transform : 値 none(入力どおり) capitalize(単語の先頭1文字だけ大文字) uppercase(すべて大文字) lowercase(すべて小文字) |
先生いわく出た記憶がない。 読み上げブラウザによっては、大文字・小文字で読み上げ方が違う。大文字で書くと一文字ずつ読み上げる(ex.Hを"エイチ")場合があるので、大文字での記述は避けた方がいい。 |
| 文字列の水平方向位置を指定するプロパティと値を答えよ。 | text-align : 値( left , center , right ) | |
| 行内またはセル内での文字列の垂直方向位置を指定するプロパティと値を答えよ。 | vertical-align : 値 行内：baseline(下部に揃える) super(上側) sub(下側) セル内：top(上揃え) middle(中央揃え) bottom(下揃え) |
|
| 特定の範囲にスタイルを指定する場合の要素を2つ挙げよ。 | div (ブロックレベル要素。要素の前後は改行される) span (インライン要素) |
|
| インデントを指定するプロパティと値を答えよ。 | text-indent : 値 数値+単位で記述。 単位 : mm , cm , in(約2.54cm) , pt(1/72in) , pc(12pt) , px , em , % |
ブロック要素のみに適用されるプロパティ。 *日本語でよく使われるのは p {text-indent : 1em} という指定。これで各段落の頭を1マス空けることができる。 em(font-sizeの算出値を参照する) 出題可能性は低い。 |
| 文字間隔を指定するプロパティは？ | letter-spacing : 値 数値+単位 または normal で指定。 |
元の間隔に指定した値分間隔が追加される。値の幅になるわけではない。 出題可能性は低い。 |
| 行間隔を指定するプロパティは？ | line-height : 値 数値+単位 または normal で指定。 |
出題可能性高い。 |
| 文章の改行方法を指定するプロパティと値を答えよ。 | word-break : 値 keep-all(和文は句読点や括弧の位置、英文は単語の区切りで改行) break-all(和文、英文ともウィンドウの右端いっぱいの位置で改行) normal(和文はウィンドウの右端いっぱい、英文は単語の区切りで改行) |
出題可能性は低い。 あまり使えない?? |
| フォントの種類を指定するプロパティは？ | font-family : 値 - 総称フォントファミリー名 - serif(明朝系。ひげ付き文字。縦横線に強弱あり) sans-serif(ゴシック系。ひげなし文字) cursive(筆記体・草書体系。手書き文字風) fantasy(装飾系) monospace(文字によって幅にバラつきがない等幅文字。) |
基本的にフォント名の前後を""で囲む。 さまざまな閲覧環境に対応するよう、複数のフォントを指定するのが一般的。複数のフォント指定は、,(カンマ)区切り、最後に総称フォントファミリー名を指定する。指定した順番に使用可能なフォントで表示される。 試験ではＭＳゴシックとOsaka(Macの日本語フォント)を知っていれば大丈夫。 総称フォントファミリー名はフォント名の前後を""で囲まない。 |
| 文字列のサイズを指定するプロパティと値を答えよ。 | font-size : 値 xx-small,x-small,small,medium,large x-large,xx-large,larger,smaller あるいは 数値+単位 |
|
| 文字列の太さを指定するプロパティと値を答えよ。 | font-weight : 値 normal,bold(一般的な太字),bolder(1段階太く),lighter(1段階細く) |
|
| 文字列の斜体を指定するプロパティと値を答えよ。 | font-style : 値 normal,italicまたはoblipue |
|
| 文字列のプロパティを一括指定するプロパティは？ | font : font-styleの値 font-weightの値 font-sizeの値 line-heightの値 font-familyの値 sizeとfamilyは省略不可。styleとweightは順番が入れ替わってもいい。 |
|
| 背景色を指定するプロパティは？ | background-color : 値 カラーコード、カラーネーム、transparent(透過色) |
通常は初期設定がtransparentになっている(ex.table)。 |
| 背景イメージを指定するプロパティは？ | background-image : url(イメージのファイル名。相対パスで指定) | CSSファイルでイメージの場所を指定する場合、HTMLから見た相対パスではなく、CSSから見た相対パスで指定(外部ファイルの場合)。 |
| 背景イメージの貼り付け方を指定するプロパティと値を答えよ。 | background-repeat : 値 repeat(領域全体に繰り返し貼り付け) repeat-x(水平方向に〜) repeat-y(垂直方向に〜) no-repeat(ひとつだけ貼り付け) |
|
| 背景のイメージの位置を指定するプロパティと値を答えよ。 | background-position : 水平方向位置の値 垂直方向位置の値 水平(left,center,right) 垂直(top,center,bottom) |
|
| 背景のプロパティを一括指定する場合の宣言は？ | background : colorの値 imageの値 repeatの値 positionの値 順番に決まりはない。半角スペースで区切る。全部指定しなくてもよい。 |
|
| 枠線のスタイルを指定するプロパティと値を答えよ。 | border-style : 値 solid(実線) double(二重線) groove(立体的にくぼんだ線) ridge(立体的に盛り上がった線) inset(ボックス全体がくぼむ) outset(ボックス全体が盛り上がる) |
|
| 枠線の上下左右のスタイルを個別に指定するプロパティは？ | border-top-style : 値 border-right-style : 値 border-bottom-style : 値 border-left-style : 値 |
|
| 枠線の太さを指定するプロパティと値を答えよ。 | border-width : 値 thin(細い) medium(標準) thick(太い) あるいは 数値+単位 |
基本のプロパティを覚えて、個別に指定したい場合に単語を加えるようにする方が効率的。 |
| 枠線の太さを個別に指定するプロパティは？ | border-top-width : 値 border-right-width : 値 border-bottom-width : 値 border-left-width : 値 |
|
| 枠線の色を指定するプロパティは？ | border-color : 値 (カラーコード、カラーネーム) | |
| 枠線の色を個別に指定するプロパティは？ | border-top-color : 値 border-right-color : 値 border-bottom-color : 値 border-left-color : 値 |
|
| 枠線のプロパティを一括指定する宣言は？ | border : styleの値 widthの値 colorの値 順番に決まりはない。値の間は半角スペース。 |
|
| 内容と枠線の間隔を指定するプロパティは？ | padding : 値 数値+単位 または auto(規定の間隔) |
|
| 内容と枠線の間隔を個別に指定するプロパティは？ | padding-top : 値 padding-right : 値 padding-bottom : 値 padding-left : 値 |
|
| 枠線の外周りの余白を指定するプロパティは？ | margin : 値 | body要素にくmarginプロパティを指定すると、ページの余白を指定できる。 |
| 枠線の外周りの余白を個別に指定するプロパティは？ | margin-top : 値 margin-right : 値 margin-bottom : 値 margin-left : 値 |
もともと空白が入っている場合に、空白を詰めるにはマイナス(ex.-10px)で指定をする。 |
| ボックスの幅を指定するプロパティは？ | width : 値 数値+単位 または auto(規定の間隔) |
|
| ボックスの高さを指定するプロパティは？ | height : 値 数値+単位 または auto(規定の間隔) |
|
| ボックスからあふれた内容の処理を指定するプロパティと値を答えよ。 | overflow : 値 visible(ボックスのサイズを拡大しすべての内容を表示) hidden(ボックスのサイズを変えずに、あふれた内容は表示しない) scroll(ボックスのサイズを変えずに、スクロールバーを表示。スクロールバーで内容確認) auto(自動でブラウザが判断) |
出題可能性低い。 IEは問題なく使えるが、ネスケでは使えないバージョンもある。 |
| ボックスからあふれた内容の水平方向位の処理を指定するプロパティは？ | overflow-x : 値 | |
| ボックスからあふれた内容の垂直方向位の処理を指定するプロパティは？ | overflow-y : 値 | |
| 要素の配置方法を指定するプロパティと値を答えよ。 | position : 値 static(要素を標準の位置に配置) relative(相対的な位置を指定。要素を標準の(staticで指定した)位置からtop,right,bottom,leftプロパティで指定した分だけ移動して配置する) absolute(絶対的な位置を指定。要素をtop,right,bottom,leftプロパティで指定した位置に絶対的に配置する) |
配置は出題可能性高い。 relativeとabsoluteを指定する場合は、top,right,bottom,leftプロパティとセットで設定する。 ex. position : absolute ;top : 10px ; left : 10px ; (コロンとセミコロンの使い分けに注意！) |
| 重ね合わせの順序を指定するプロパティは？ | z-index : 値 relative または absoluteを指定し、要素同士が重なって表示される場合に、重ね合わせの順序を指定する。 値には1,2,3と整数で指定。数値が大きいほどその要素は前面に表示される。 |
特に指定しない場合は上に記述した順番に重なる。 |
| 要素の表示/非表示を指定するプロパティは？ | visibility : 値 visible(要素を表示) hidden(要素を非表示) |
出たこともある。 |
| 要素の表示形式を指定するプロパティは？ | display : 値 block(インライン要素をブロック要素にする。要素の前後は改行される) inline(ブロック要素をインライン要素にする。要素の前後は改行されない) list-item(要素をリスト項目にする) none(要素を存在しないものとして処理する) |
list-itemは見出しにリストをつける場合等に使う。 出たこともある。 |
| 回り込みを指定するプロパティは？ | float : 値 left(要素を左揃えにし、後ろに続く文字列やイメージなどを要素の右側に回りこませる) right(上記文章の右左を置き換えて読む) none(要素の周りに文字列やイメージを回り込ませない) |
出題頻度は低いが一応押さえる。 |
| 回り込みを解除するプロパティは？ | clear : 値 left(左揃えした要素の回り込みを解除) right(右〜以下同上) both(右左両方の要素の回り込みを解除) none(回り込みを解除しない) |
出題頻度は低いが一応押さえる。 |
| 行頭記号または行頭番号の種類を指定するプロパティと値の種類を答えよ。 | list-style-type : 値(種類) disk(黒丸) circle(白丸) square(四角) decimal(1.2.…) lower-roman(i.ii.…) upper-roman(I.II.…) lower-alpha(a.b.…) upper-alpha(A.B.…) |
|
| リンク部分に使う擬似クラスを記述ルール順に答えよ。 | a:link{ } a:visited{ } a:hover{ } a:active{ } 上記の順番で指定しないと正確に表示されない場合がある。 |
設定したクラス名を適用するときにスペル間違いをしない。 擬似クラスは出題可能性高い。 - クラスとIDの違い - IDはひとつのHTMLファイルで一箇所しか適用できない。 IDは設定するときに「.」ではなく「#」で書き始める。 |
ページ先頭へ |言語などの学習トップ |HTMLタグ一覧 |CSS一覧 |用語一覧 |Webクリ初級 |Webクリ上級(HTML) |ショートカット |トップページ