CSSのセレクタをゲーム感覚で覚える「CSS Diner」

Pocket

コンピューター系のスキルはゲームで覚えるのが良い気がしています。そんな訳で、CSSのセレクタ、意外とよく分かっていないという人はCSS Dinerをどうぞ。意外と面白いですよ。

遊び方

CSS_Diner_-_Where_we_feast_on_CSS_Selectors__2

CSS Dinerにアクセスすると、寿司下駄の上に「Select the plates」といった感じで何を指定するかの指示が出るので、その指示に従ってセレクタを記述します。上の画像の場合はplateと入力してエンターを押せばレベル1クリアです。

CSS_Diner_-_Where_we_feast_on_CSS_Selectors__1

そんな感じでセレクタを指定しながら進んでいくと、どんどんレベルが上がって、少しずつ難しい指定がされていきます。「分からないなー」という場合は、右のヒントを見ながら指定すればOK。

CSS_Diner_-_Where_we_feast_on_CSS_Selectors_

レベル26まであります。

最後まで辿り着くと何が待っているのでしょうか・・・それはあなたの目で確かめて下さい。

CSS Diner

これからの「標準」を身につける HTML+CSSデザインレシピ (Web Designing Books)
エ・ビスコム・テック・ラボ
マイナビ
売り上げランキング: 5,522
すべての人に知っておいてほしい HTML5 & CSS3 の基本原則
秋葉秀樹 安住 光 大藤 幹 多田吉臣 筒井志信 鍋坂理恵 ハヤシユタカ 比留間和也 吉岡 梅
エムディエヌコーポレーション
売り上げランキング: 260,061