CSS初心者ノート

CSS初心者さん向けに、基本構文・文字装飾・背景・レイアウトなどをやさしく解説するシリーズです。HTMLとの組み合わせで見た目を整えるコツを学べます。

ブログの進め!

【第16回】CSSプロパティ解説まとめ(最終回)|CSS初心者ノート

CSS初心者ノート最終回。よく使うCSSプロパティ・カードUI完成形・迷ったときに戻る回を一覧で整理しました。全部覚えなくてOK、必要なときの目印として使えるまとめ記事です。
ブログの進め!

【第15回】セレクタ応用テクニック|CSS初心者ノート

CSS初心者向け第15回。子孫セレクタや疑似クラス(first-child、last-child、nth-child)を使って、特定の要素だけにスタイルを当てる方法を解説します。コード例つきで、CSS指定の幅が一気に広がります。
ブログの進め!

【第14回】CSSでアニメーションを作ってみよう|CSS初心者ノート

CSS初心者向けの第14回。transitionで「なめらかな変化」、@keyframesで「繰り返す動き」を作る方法を紹介。ホバーボタンのアニメーションや点滅テキストなど、実際に使えるコード付きでわかりやすく解説します。
ブログの進め!

【第13回】簡単な実践(カードUIを作ってみよう)|CSS初心者ノート

CSS初心者向けの第13回レッスンでは、背景色・余白・枠線・角丸を使ってシンプルなカードUIを作る方法を紹介します。まずは最小コードだけで作るSTEP1、次に少し整えるSTEP2の2段階で、誰でもわかりやすく実践できます。
ブログの進め!

【第12回】セレクタ応用と優先順位|CSS初心者ノート

CSS初心者向けに、セレクタの組み合わせ方(複合セレクタ)や優先順位の仕組みをやさしく解説。カスケードや!importantを理解して、「なぜ効かない?」を解決しましょう。
ブログの進め!

【第11回】クラスとIDを使ってみよう|CSS初心者ノート

CSS初心者向けに、クラス(.class)とID(#id)の違いと使い方を解説。複数要素に共通デザインを当てたいときや、一部だけを指定したいときに役立つセレクタ基礎を学びます。
ブログの進め!

【第10回】リストとリンクのデザイン|CSS初心者ノート

CSS初心者向けに、list-styleでリスト記号を変える方法や、a:link / :hover / :visitedでリンクの色・下線を調整する基本をわかりやすく解説します。
ブログの進め!

【第9回】幅・高さ・中央配置をマスターしよう|width / height / margin: auto【CSS初心者ノート】

CSSの基本「幅・高さ・中央配置」を初心者向けに解説!width / height / margin: auto の使い方と、よくあるミス・中央揃えのコツを図解付きで学びます📘
ブログの進め!

【第8回】枠線をデザインしてみよう|border / border-radiusで角丸ボックスを作る【CSS初心者ノート】

CSS初心者向けに、borderとborder-radiusの使い方をやさしく解説。角丸やカード風ボックス、見出し線など、枠線をデザインするコツをコード例付きで紹介します。