実技試験で間違えやすい場所はここだ!

実技試験で間違えやすい場所はここだ!

【目次】

このページでは「Webクリエイター能力認定試験」の実技問題で、特に間違えやすい点を紹介しています

正確な知識が身についているか確認できるよう簡単な選択問題にしてみました。
正解と思われるものを選んで下さい。
答え」をクリックすると正解が表示されます。

正解不正解

公式テキストを繰り返し学習し、模擬試験プログラムを何度かこなした方向けの内容となっております。

HTMLタグやCSSルールの詳しい説明は公式テキストをご覧ください。

外部CSSの読み込み

問1 正しいものを選びなさい。



マル<link rel="stylesheet" href="css/stylesheet.css">
バツ<link rel="stylesheet" src="css/stylesheet.css">

問2 正しいもの選びなさい。



バツ@inport: url(style1.css);
バツ@inport: url(style1.css)
マル@import url(style1.css);
バツ@import: url(style1.css)

JavaScriptの読み込み

問3 正しいものを選択しなさい。




バツ<script href="js/slideshow.js"></script>
マル<script src="js/slideshow.js"></script>
バツ<link rel="javascript" href="js/slideshow.js">
バツ<link rel="javascript" src="js/slideshow.js">

リストマーカーの非表示

問4 正しいものを選択しなさい。





バツlist-style: none;
マルlist-style-type: none;
バツliststyle-type: none;
バツlist-styletype: none;

  • 非表示」のほかに「黒丸(<ul>のデフォルト)」、「白丸」、「四角形」、「10進数(<ol>のデフォルト)」があります。
  • それぞれのプロパティ値を覚えておきましょう♪
  • ちなみにこのスペースは一番下だけ「last-child」を使用して表示設定を変えています。
  • (参考:Webクリエイター能力認定試験HTML5対応エキスパート p.103

ヘッダー・フッターの中央揃え

問5 正しいものを選択しなさい。




バツ  overflow: hidden;
バツ  text-align: center;
バツ  padding-left: auto;  padding-right: auto;
マル  margin-left: auto;  margin-right: auto;

左へ回り込ませる

問6 正しいものを選択しなさい。




バツ  flowt: left;
マル  float: left;
バツ  flort: left;
バツ  overflow: left;

背景画像の設定

問7 複数の背景画像の設定として正しいものを選択しなさい。




マルbackground-image: url(../images/1.png), url(../images/2.png);
バツbackground-image: url(../images/1.png) url(../images/2.png);
バツback-groundimage: url(../images/1.png), url(../images/2.png);
バツback-ground-image: url(../images/1.png) url(../images/2.png);

問8 複数の背景画像を繰り返さない設定として正しいものを選択しなさい。




バツbackground-repeat: none, none;
バツbackground-repeat: norepeat, norepeat;
マルbackground-repeat: no-repeat, no-repeat;
バツback-ground-repeat: no-repeat, no-repeat;

問9 背景画像の1枚目を「左上」、2枚目を「右中段」に表示させる設定として正しいものを選択しなさい。




バツbackground-position: left top, right middle;
マルbackground-position: left top, right center;
バツbackground-position: top left, middle right;
バツbackground-position: top left, center right;

問10 背景画像をスクロールに合わせて移動させる設定として正しいものを選択しなさい。




バツbackground-position: fixed;
バツbackground-position: scroll;
マルbackground-attachment: scroll;
バツbackground-attachment: scorll;

<input>タグの設定

問11 テキストフィールドの幅を「200px」に設定したものを選択しなさい。




バツinput(type=[text]){ width: 200px; }
バツinput[type(text)]{ width: 200px; }
バツinput[type=(text)]{ width: 200px; }
マルinput[type="text"]{ width: 200px; }

テーブルの設定

問12 テーブルのキャプション(表題)を配置した設定として正しいものを選択しなさい。




バツcaption: bottom;
マルcaption-side: bottom;
バツcaption-position: bottom;
バツtable-caption: bottom;

問13 テーブルの罫線を1本線にする設定として正しいものを選択しなさい。




バツborder: solid;
バツborder-spacing: collapse;
バツborder-separate: collapse;
マルborder-collapse: collapse;

最後に

他にも間違えやすいところ、ややこしいところがいくつもあります。
ミスした箇所に付箋を貼ってノートにまとめておく記憶に定着しやすくなるだけでなく、試験直前の最終確認にも役立ちます。

試験前日、および当日の準備や心構え等については体験談をご覧下さい。
何か1つでも参考になることがあるかもしれません。

TOP