CSS 【入門編】 :nth-child() 擬似クラスの構文と数式 – CSS実践ガイド
CSSの世界へようこそ。フロントエンドの現場で長年戦ってきた身から言わせてもらうと、CSSは時に「気難しい友人」のように感じることがあるかもしれません。でも、一度そのロジックさえ掴んでしまえば、これほど頼もしい相棒はいません。今日は、多くの...
CSS
CSS CSS 【入門編】 ユーザーアクション擬似クラス (:hover, :active, :focus) – CSS実践ガイド
ようこそ、CSSの世界へ。フロントエンドの現場で長年コードを書き続けてきた私から、これからCSSを学ぶあなたへ、一番大切な「対話」の話をさせてください。CSSって、ただ色を塗ったり形を作ったりするだけの道具だと思っていませんか？ 実は、ウェ...
CSS 【入門編】 リンク擬似クラス (:link, :visited) – CSS実践ガイド
こんにちは！フロントエンドの現場で長年CSSと格闘してきた、いわば「CSSの番人」のような者です。Web制作を始めたばかりの頃、誰もが一度は「あれ？リンクの色が変わらないぞ？」と首を傾げた経験があるはずです。今日は、そんな初学者の皆さんが必...
CSS 【入門編】 !important 規則 – CSS実践ガイド
こんにちは！フロントエンドの現場で長年CSSと格闘してきたアーキテクトです。CSSを学び始めると、誰もが一度は「あれ？なんでこのスタイルが効かないんだ……？」と頭を抱える夜を経験しますよね。そんな時、ネットの海で「とりあえず `!impor...
CSS 【入門編】 詳細度（Specificity）の計算概念 – CSS実践ガイド
こんにちは。CSSの世界へようこそ。CSSを書き始めて、「あれ？ なんでこのスタイルが反映されないんだ？」と頭を抱えたことはありませんか？ コードを書いても書いても、なぜか文字の色が変わらない。そんなとき、画面の向こう側でCSSの神様が「ま...
CSS 【入門編】 属性セレクタ ([attr|=value]) – CSS実践ガイド
こんにちは！Webの世界へようこそ。フロントエンドの現場で長年CSSと格闘してきた私から、今日は少しマニアックだけど、知っていると「おっ、デキるな」と思われる魔法のようなセレクタを紹介します。その名は属性セレクタ ``。「なんだか記号だらけ...
CSS 【入門編】 属性セレクタ ([attr~=value]) – CSS実践ガイド
やあ、こんにちは。CSSの世界へようこそ。フロントエンドの深淵を覗き込んでいる君に、今日はちょっとだけマニアックだけど、知っておくと「おっ、デキるな」と思われる、そんな奥義を授けようと思う。今回取り上げるのは、属性セレクタの``だ。「なんだ...
CSS 【入門編】 属性セレクタ ([attr$=value]) – CSS実践ガイド
CSSの世界へようこそ！フロントエンドの最前線でコードを書いていると、つい「どうやって複雑なUIを作るか」ばかり考えがちですが、実はCSSの面白さって、こういう「痒いところに手が届く」ような小さな道具をどれだけ使いこなせるかに詰まっているん...
CSS 【入門編】 属性セレクタ ([attr^=value]) – CSS実践ガイド
やあ、こんにちは。CSSの世界へようこそ。フロントエンドの深淵を覗き込んでいる君なら、きっと「クラス名（class）」や「ID」を使ってスタイルを当てることにはもう慣れているはずだね。でもね、現場でコードを書いていると、時々こんな悩みにぶつ...
CSS 【入門編】 属性セレクタ ([attr*=value]) – CSS実践ガイド
やあ！CSSの世界へようこそ。フロントエンドの迷宮を旅する皆さんのガイド役、チーフアーキテクトです。CSSを学び始めると、最初は「クラス名（`.btn`など）をつけてスタイルを当てる」という基本に忠実になるよね。それはとても素晴らしいことだ...