CSS 【CSS】gridジェネレーターを使って簡単にグリッドレイアウトを手に入れよう！
「display: grid」って今まで使ったことなかった。便利だろうな～とは思ってたけど、なんか難しそうと思って「inline-block」を使い続けてた。管理のしやすさとか、コード量削減とかを考えると、「flexbox」か「grid」を...
CSS
CSS 
javascript 【コピペOK！】ON/OFFスイッチのデザイン７個｜iOS風スイッチもあるよ！
フォームやインタラクティブなサイトで使えるON/OFFのトグルスイッチのデザイン7つのご紹介。シンプルなものなので様々な所で利用できるトグルスイッチ７つを作ってみたのでぜひぜひコピペして利用してくれたら嬉しいです！チェックボックスは見えない...
CSS CSSでテキストを選択禁止にする方法
文字の上をマウスでダブルクリックしたりドラッグして移動すると選択されてしまうテキスト。デザインの邪魔だったりする時がある。選択したテキストを装飾する方法もあるけど装飾が必要ない時は、今回紹介する方法で解決です！CSSuser-select:...
CSS 【CSS】めっちゃ便利なグラデーションジェネレーター
カードUIや背景、画像の上にも、ホントいろんな所で滅茶苦茶使うグラデーションも自由に使えないと単色でいいかな。と思っちゃう。でもグラデーションを使った方がひと手間かかってる気がするし、結構な場面でマが埋まる感じがして多用しがち。今回紹介する...
CSS 【CSS】特定ブラウザだけに効くCSSの書き方｜IE10以下、IE11、Firefox、Chrome、Safari、EDGE、Opera
特定ブラウザだけに適応するCSSの書き方のご紹介です。「IE11だけ表示がズレる」とか「FireFoxだけフォームが変」とか、「Safari」のみに対応した書き方とか、「Opera」。。。オペラはなんかあるかな。。。そんな特定ブラウザだけに...
javascript 【jQuery】CSS変数をjQueryで利用する方法
CSSで指定したCSS変数をjQueryで利用する方法のご紹介です。jQueryで変数作っちゃっても良いけど、そうできない時もある。例えば、、、、ん～あるかなぁ。jQueryで変数作れない時は、あるっ！としてCSS変数を書き換える方法です。...
CSS CSSでダークモードに即対応。OSの画面設定をウェブでも利用しよう！
海外のサイトとか見てると、自分のiphoneの設定をダークモードにしてる時、勝手に暗いデザインで表示されてるのを見てどうやってやってるのか疑問だった。きっとjsでデバイス情報を取得して、なにかしてるんだろうと思ったけど違った。CSSだけでで...
CSS CSSで角丸四角の作り方
ボダンや画像など、やんわりと表現したいときや、流行りのデザインっぽさを取り入れたいときに使うのがCSSのborder-radius。border-radiusには2つの書き方があり「border-radius: 10px;（全部の角を10p...
javascript jQueryでCSSを動的に変更・追加・削除する方法
jQueryでCSSを変更する方法のご紹介です。どうやってCSSを変更したらいいかわからない時などにご覧いただければ嬉しいです。
CSS 【CSS】疑似クラスの指定方法｜最初・最後・n番目・奇数・偶数
cssで特定箇所のみにスタイリングしたい場合に効率的にかっこよく書ける疑似クラス特集です。奇数番目１，３，５，７，９…番目を装飾する時li:nth-child(odd) { color: #82fcc9;} リスト（奇数） リスト（偶数） ...
