独り言

プログラミングの講師をしています。新人研修で扱う技術の解説と個人の技術メモ、技術書の紹介など

【CSS】CSS理解度チェック

CSSに関する理解度を確認するための問題集です。
CSSの理解度の確認、及び理解を深めるためのツールとしてご確認ください。
基本的には以下の記事を参考に作成していますので、わからない場合は下記の記事を参考にしつつネットや書籍で調べてみてください。

case10.hateblo.jp

用語

以下のCSSに関する用語の意味を簡潔に説明してください。

プロパティ

以下のプロパティの意味を説明してください。

  • background
  • color
  • font-size
  • font-weight
  • text-decoration
  • font-family
  • text-align
  • line-height
  • width
  • height
  • padding
  • border
  • margin
  • float
  • position
  • display

セレクタ

aとbをセレクタとしたとき、以下の書き方で適用範囲がそれぞれどう変わるか答えなさい。

  • a, b
  • a b
  • a > b
  • a + b
  • ab

リンクに関する以下の疑似クラスはそれぞれどのようなときにスタイルが適用されるか答えなさい。

実現方法

以下を実現するためのプロパティや値を答えなさい。

  • リストの項目の左側に表示される黒丸や数値の表示形式を変更するプロパティ
  • marginやpaddingを指定するときに上下左右それぞれに同じ値を指定する方法
  • marginやpaddingを指定するときに個別で指定する方法
  • marginやpaddingを指定するときに一括で4か所に異なる値を設定する方法
  • 縦並びの要素を横並びに配置する方法
  • 横並びの要素を縦並びに配置する方法
  • ブラウザの幅によって適用されるスタイルを変更(レスポンシブデザイン)する方法

  • サイズを指定するときの指定の方法を答えなさい
  • 値で色を指定するときに使用できる色の指定方法

その他

  • WebページにCSS(スタイル)を適用する方法は3つある。3つの適用方法と、それぞれの方法のメリット・デメリットを答えなさい