Web Basics — HTML & CSS · ⁨Web基礎 — HTML & CSS⁩

Every lesson runs in your browser — write real code, press Run, and the tasks check themselves. Free, no account needed, with translated notes paired with English. · ⁨全レッスンはブラウザ内で実行され、実際のコードを記述し、「実行」ボタンを押すだけでタスクが自己確認を行う。無料であり、アカウント不要。翻訳付きメモが英語とペアになっている。⁩

Start the course · ⁨コース開始⁩

Lessons in this course · ⁨このコースのレッスン⁩

No lessons match. Clear the search or choose another filter.

1. history A short history of the web · ⁨ウェブの簡易な歴史⁩ Reading and resources
2. usage What a web page is made of · ⁨ウェブページは何で作られているか⁩ Reading and resources
3. resources Where to learn more · ⁨さらに学ぶ場所⁩ Reading and resources
4. setup What you need (almost nothing) · ⁨必要なもの（ほとんど何もない）⁩ Reading and resources
5. 01 Your first web page 2 required tasks Video · ⁨動画⁩
6. 02 Headings and paragraphs · ⁨見出しと段落⁩ 2 required tasks Video · ⁨動画⁩
7. 03 Bold, italic and line breaks · ⁨太字、イタリック、改行⁩ 2 required tasks Video · ⁨動画⁩
8. 04 Lists · ⁨リスト⁩ 2 required tasks Video · ⁨動画⁩
9. 05 Links 2 required tasks Video · ⁨動画⁩
10. 06 Images 2 required tasks Video · ⁨動画⁩
11. 07 Make it a real page 2 required tasks Video · ⁨動画⁩
12. 08 Comments and neat nesting · ⁨コメントと整然としたネスト⁩ 2 required tasks Video · ⁨動画⁩
13. 09 Tables 2 required tasks Video · ⁨動画⁩
14. 10 Forms · ⁨形態⁩ 2 required tasks Video · ⁨動画⁩
15. 11 Boxes and sections 2 required tasks Video · ⁨動画⁩
16. 12 Add some style · ⁨スタイルを追加する⁩ 2 required tasks Video · ⁨動画⁩
17. 13 Selectors — class and id · ⁨セレクター — クラスとID⁩ 2 required tasks Video · ⁨動画⁩
18. 14 Colours and backgrounds · ⁨色と背景⁩ 2 required tasks Video · ⁨動画⁩
19. 15 Styling text · ⁨テキストのスタイリング⁩ 2 required tasks Video · ⁨動画⁩
20. 16 The box model 2 required tasks Video · ⁨動画⁩
21. 17 Spacing — margin and padding 2 required tasks Video · ⁨動画⁩
22. 18 Showing and hiding (display) · ⁨表示と非表示 (display)⁩ 2 required tasks Video · ⁨動画⁩
23. 19 Width and centering 2 required tasks Video · ⁨動画⁩
24. 20 Rows with Flexbox 2 required tasks Video · ⁨動画⁩
25. 21 Mini-project: a profile card 3 required tasks Video · ⁨動画⁩

Language reference · ⁨言語リファレンス⁩

/know/reference/html