HTML / CSSの使い方

ウェブサイト作成の基本はHTMLとCSS（とJavaScript）です。 HTML（Hyper Text Markup Language）はサイトの骨組み、CSS（Cascading Style Sheets）はサイトに服を着せる言語です。

ウェブ技術に関することなので、ウェブ検索するとさまざまな情報がヒットします。 中にはすでに古い情報もあります。 最新の機能や仕様に関することはMDNのドキュメントを調べるとよいです。

また、現在のウェブ標準はWHATWGが決めたHTML Living Standardです。 Can I Useでブラウザごとの対応状況を調べることができます。

HTMLしたい

• HTMLしたい（doctype）
• メタ情報したい（meta）
• 段落したい（p）
• 画像したい（img）
• 画像したい（figure）
• 外部リンクしたい（a）
• セマンティクスしたい（semantics）
• 構造化データしたい（JSON+LD）

CSSしたい

• セレクターしたい
  • グループ化したい（,）
  • 子孫結合子したい
  • 子結合子したい（>）
• CSS変数したい
  • グローバル変数したい（:root）
• ネストしたい
• フォントしたい（font）
  • 書体したい（font-family）
  • サイズしたい（font-size）
• 要素の表示レベルを変更したい（display）
  • ブロックレベルにしたい（display: block flow）
  • インライン要素したい（display: inline flow）
• 余白したい（margin）
• 余白したい（padding）
• レスポンシブしたい
  • ビューポートしたい
  • メディアクエリしたい
  • ブレークポイントしたい

ウェブフォントしたい

• FontAwesome

フレームワークしたい

CSSフレームワークを使うと、比較的簡単にウェブをデザイン／レイアウトできます。 そこそこの見た目をさくっと作りたい場合に便利です。 たいていの場合、CDNを経由して読み込ませるのでよいと思います。

以下は、僕がこれまで使ったことがある順番に並べてみました。

• Materialize

• Bootstrap

• MDB - Material Design for Bootstrap v5 & v4

• TailwindCSS

• Tailwind Components

• PicoCSS

• Sakura

• MVP.CSS

SSGしたい

• Sphinxの使い方

• Hugoの使い方

• MySTの使い方

サーバーしたい

• ウェブサーバーしたい（httpd）
• ウェブサーバーしたい（nginx）

未分類

• RSSの作り方
• ブラウザを知りたい
• Gutenberg