/category/html
HTML
ページの骨組みをつくる基本タグを1テーマずつ。
10 件
- 01div と span はいつ使う? — 迷ったときの判断基準とりあえず div で囲む、という書き方から抜け出すための記事です。div と span の違い、そして「div を使わないほうがいい場面」を、実際に並べて確かめます。
- 02読みやすいコードの書き方 — インデントと命名の作法動けばいい、で書いていると、1週間後の自分が読めなくなります。今日から使える、たった3つの習慣にしぼって紹介します。
- 03箇条書きの書き方 — ul・ol・li の関係を1回で覚えるリストは実務でいちばん多く書くタグのひとつです。ul と ol の使い分け、そして「liの直下に何を置けるか」を押さえておくと、あとでレイアウトが崩れにくくなります。
- 04フォームの作り方の基本 — input と label をセットで書く問い合わせフォームは、入力欄を並べるだけでは不十分です。label を正しく結びつけるかどうかで、使いやすさが大きく変わります。最小構成から組み立てます。
- 05表(table)の書き方 — 3つのタグの入れ子を覚えるだけ表はタグが多くて難しそうに見えますが、覚えるのは「表・行・マス」の3つだけです。入れ子の順番さえ間違えなければ、必ず組めます。
- 06リンクと画像の書き方 — a と img でつまずくのは属性タグ自体は短いのに、なぜかリンク先に飛ばない・画像が出ない。原因のほとんどは属性の書き方です。書き方の型と、崩れたときの見え方をまとめて確かめます。
- 07HTMLで記号が消える・崩れるとき — 特殊文字とエスケープ文章に < を書いたら、そこから先が消えた。コピペしたコードが表示されない。原因は「HTMLにとって意味のある文字」を、そのまま書いてしまったことです。
- 08意味のあるタグを使う — header・main・footer の使いどころすべて div でも動きます。それでも header や main を使う理由は「読む相手が人間だけではない」から。使い分けの基準を、迷わない形にまとめます。
- 09見出しタグ h1〜h6 の使い方 — 大きさで選ぶと失敗するh1が大きくてh6が小さい。そう覚えると必ずつまずきます。見出しは大きさではなく「階層」で選ぶもの。その理由と正しい順番の付け方を、実際に並べて確かめます。
- 10HTMLの骨組みを1行ずつ読む — 最初のファイルに何を書くかHTMLファイルの先頭に並ぶ、呪文のような数行。コピペで済ませがちなあの部分が何をしているのかを、1行ずつ確かめていきます。その場で書き換えて動かせるデモつきです。