• このエントリーをはてなブックマークに追加

HTML5プロフェッショナル認定試験レベル1 サンプル問題

1.4 レスポンシブウェブデザイン に関する問題

例題4.7「1.4.1マルチデバイス対応ページの作成」
レベル1の出題範囲「1.4.1マルチデバイス対応ページの作成」からの出題です。
デバイスの画面幅に合せて表示領域を指定する場合に設定するviewportのcontent属性を選択してください。
  • content="device-width"
  • content="width=device-portrait"
  • content="width=device-horizontal"
  • content="width"
  • content="width=device-width"

※この例題は実際のHTML5プロフェッショナル認定試験とは異なります。

正解 E
表示領域のサイズや拡大縮小を設定する、viewportに関する問題です。
スマートフォン上のブラウザで表示する際には、基本的にPC上で横幅980pxのブラウザで表示したのと同じような見た目になるように扱われます。
しかし、この設定では縮小表示になってしまい、文章が読みにくくなることがあります。
<meta name="viewport" content="width=device-width"> (E.)
と記述することで、スマートフォンのデバイスの横幅で描画が行なわれるようになります。
他の選択肢は間違いです。
正しい記述はcontent=""の中にwidth=device-widthが入りますので注意が必要です。

出題範囲の詳細

例題解説の提供:HTML5アカデミック認定校 株式会社クリーク・アンド・リバー社
HTML5レベル2認定者 高井 歩 氏

例題解説とその内容については、例題提供者の監修です。内容や試験問題に関わるお問い合わせにつきましては、LPI事務局ではお応えできませんのでご了承ください。
例題解説のご提供者さまを募集中です。LPI-Japan事務局までぜひご投稿ください。選ばれた方の例題解説は本サイトに掲載させていただきます。

このページの先頭へ