もう当たり前に、使えている人は便利に使っていると思いますが、
これって一体なんなんだろうとか、どういう時に便利なの？
と、いまさら聞けないCSSの変数（カスタムプロパティ）について、
何がどうなっているかは知っておきたい。とこっそり思っておられる方のために、
「見たことある」から「知ってる！使ったことある！」ぐらいになるよう説明しておきます。

The post いまさら聞けない。CSSの変数（カスタムプロパティ）ってどんな時に便利なの？基本的な設定とテクニック first appeared on コピペっと copypet.jp｜パーツで探す、web制作に使えるコピペサイト。.

属性セレクターを使えば特定の要素にcssを適用できたりして、とっても便利です。
例えばWordPressを使っている時など、class名「post-00」などが決まったルールで自動で吐き出されますが、これを利用して「post」を含むclass名に同じcssを適用したい。とか、いろんな事情でフロントのhtmlには手を加えられない時などcssだけでどうにかしたいと思う時に使えます。

The post 属性セレクターをうまく使うと特定の要素にまとめてcssが適用できて便利になるよ！ first appeared on コピペっと copypet.jp｜パーツで探す、web制作に使えるコピペサイト。.

「コピペでできる！cssとhtmlのみで作るいい感じの背景パターン 12選」や
「コピペでできる！cssとhtmlのみで作るちょっと複雑なの背景パターン 11選」で
使っているボーダーやストライプの表現ですが、ちょっとしたブロックの背景や見出しの背景などにも使えますよね。
でもちょっと「アレンジしたい」「角度を変えたい」などの希望もあると思います。
そこで今回はグラデーションを使ったボーダーやストライプの基本的な作り方をご説明します。

The post グラデーションを使って作ろう！背景パターンでストライプやボーダーの基本的な作り方 first appeared on コピペっと copypet.jp｜パーツで探す、web制作に使えるコピペサイト。.

copypet.jpでも実は頻繁に登場する擬似クラス。
リストやブロックなどループで要素を設定している時に、◯番目だけ違うデザインを当てたいんだけど、いちいちクラスを設定してその都度クラスを指定するのって何度もやるとイライラするのよねぇ。って時や、チェックが入っている時だけこのデザインにしたい！なんてことってよくありませんか？
これ擬似クラスを使うとわりとチャチャっとできちゃいます。
擬似クラスって何よ？って思った方もいるかと思いますが、身近な擬似クラスといえば「:hover」です。よく使ってるでしょ？
擬似クラスを使えるようになってデザインやカスタマイズの幅を広げましょう。

The post 知っているととっても便利！擬似クラスって何？どうやって使うの？ first appeared on コピペっと copypet.jp｜パーツで探す、web制作に使えるコピペサイト。.

copypet.jpでも頻繁に使っている::before(:before)と::after(:after)ですが、コピペだけしていると調整やプラスアルファのデザインを加えたい時に悩んでしまうこともあるでしょう。
とりあえずコピペすりゃええと思うが、だがしかし・・・何がどうなっているかは知っておきたい。とこっそり思っておられる方のために「何とな〜くわかる」から「知ってる！知ってる！」ぐらいになるよう説明しておきます。

The post で？そもそも擬似要素の::before(:before)と::after(:after)って何がどうなってどう使えるの？ first appeared on コピペっと copypet.jp｜パーツで探す、web制作に使えるコピペサイト。.