タグ

2017年11月27日のブックマーク (1件)

  • JavaScript を使わず HTML と CSS だけで Todo アプリを書く方法 - Frasco

    HTMLCSS だけで Todo アプリを作りました。TodoMVC(今回デザインを使用使わせてもらいました)と違って JavaScript は使っておらず、すべてのインタラクションが CSS で動いています。 どういう仕組みなのでしょう?簡単に説明すると、HTMLCSS の一般兄弟セレクタ(~)、CSS カウンタ、それから :checked 、:target、:required 疑似セレクタを組み合わせてできています。詳細についてはこれから説明していきます。 アプリを試してみる ソースを見る できること: Todo の追加(最大50件) Todo の完了 Todo の削除 フィルタリング(完了・未完了) 残りのアイテム数をカウントする 空文字の追加を許可しない できないこと: ページリロード後の永続性の維持 「すべての Todo を完了にする(Mark all as done)」

    JavaScript を使わず HTML と CSS だけで Todo アプリを書く方法 - Frasco