CSS 【入門編】 ::grammar-error 擬似要素による文法エラー表示 – CSS実践ガイド
こんにちは！フロントエンド・アーキテクチャの現場を長年歩んできた私ですが、今日はCSSのちょっとマニアック、だけど知っていると「おっ！」とちょっと誇らしくなれる、そんな面白い機能のお話をしますね。CSSの勉強を始めたばかりの頃って、クラスセ...
CSS
CSS CSS 【入門編】 ::spelling-error 擬似要素によるスペルミス表示 – CSS実践ガイド
こんにちは！フロントエンドの現場を長年フラフラと……もとい、渡り歩いてきたチーフアーキテクトの私です。CSSの世界へようこそ！ 日々、レイアウトや色調整に悪戦苦闘していませんか？「あっちを直せばこっちが崩れ……」なんて、CSSあるあるですよ...
CSS 【入門編】 ::file-selector-button 擬似要素によるファイル選択ボタンの装飾 – CSS実践ガイド
みなさん、こんにちは！Web制作の世界へようこそ。フロントエンドの現場を長年歩んできたチーフアーキテクトの私ですが、今日はCSSのちょっとした「隠し味」のような、すごく便利で愛すべき機能についてお話しさせてくださいね。CSSを書いていると、...
CSS 【入門編】 ::first-letter 擬似要素によるドロップキャップ – CSS実践ガイド
こんにちは！フロントエンドの現場を長年フラフラと……もとい、渡り歩いてきたチーフアーキテクトの私です。CSSを書き始めた頃って、いろんなプロパティやセレクタがあって、まるで巨大な遊園地に来たみたいにワクワクしますよね。でも同時に、「あれ、こ...
CSS 【入門編】 ::first-line 擬似要素による最初の行のスタイル – CSS実践ガイド
こんにちは！フロントエンド・チーフアーキテクトの私です。CSSを書き始めたばかりの頃って、「あれ？このスタイル、なぜか一部分だけ適用されないな……」「なんだか思い通りに動いてくれない！」なんて壁にぶつから ofta（よく）ありませんか？大丈...
CSS 【入門編】 ::after 擬似要素による装飾とclearfix – CSS実践ガイド
こんにちは！CSSの泥臭い世界へようこそ。チーフアーキテクトの私です。Web制作を学び始めると、必ずと言っていいほどぶつかる壁がありますよね。「あれ？ なんかボックスが変なところに入り込んじゃった……」「要素の脇にちょっとしたアイコンを付け...
CSS 【入門編】 ::before 擬似要素の活用とcontentプロパティ – CSS実践ガイド
こんにちは！フロントエンドの現場を長年歩んできた、あなたのCSSの伴走者です。CSSを勉強し始めると、なんだか不思議なコードに出会いませんか？そう、今日の主役である `::before` 擬似要素（ぎそようそ） と、その相棒である `con...
CSS 【入門編】 :defined擬似クラス – CSS実践ガイド
こんにちは！フロントエンドの現場を渡り歩いてきた、シニアアーキテクトの私です。CSSの勉強をしていると、次から次へと新しいセレクタが登場して「もう、覚えきれないよ…！」と頭を抱えたくなりませんか？ `>` とか `+` とか、果てには `:...
CSS 【入門編】 :lang()擬似クラス – CSS実践ガイド
こんにちは！フロントエンドの現場を長年フラフラと……もとい、最前線で走り抜けてきたチーフアーキテクトの私です。CSSの勉強を始めたばかりの頃って、`.class`や`#id`、そして「スペースで繋ぐ子孫セレクタ」あたりまでは「なるほど、おも...
CSS 【入門編】 nth-child(an+b of selector) の構文 – CSS実践ガイド
こんにちは！CSSの泥臭い現場を駆け抜けてきたチーフアーキテクトの私ですが、今日は少し肩の力を抜いて、CSSを学び始めたばかりのあなたへ、とびきりワクワクする技術のお話をさせてください。Webサイトを作っていると、「リストの上から3番目だけ...