-
CSSで小さい画像・ドット絵をボケずに拡大させる例えばこういう場合・・・ ドット絵をきれいに表示できない 小さい画像を拡大表示するとぼける これはCSSから簡単に解決できます。 自分自身もその方法を知らなかったので、 CSSにて小さい画像をぼかさず拡大表示する方法を紹...
-
Bootstrapで *-primary の色を一括変更するにはタイトルの通り。 Bootstrapでの *-primary 色の変え方について。 自力で書き変えする方法もありますが、 一括でprimary色を変更するツールもあります。 超便利だったので、その方法をまとめました。 デ...
-
セレクトボックスを文字色変更したり装飾する方法【Bootstrap】セレクトボックス(select)を作るとき・・・ option内の文字色を変えたり、 optionの横にアイコン表示したり、 optionに何か装飾を加えたい、 そういう場面がありました。 そこで セレクトボックスのop...
-
CSSの :nth-child、:nth-of-type などにクラス名を使う落とし穴ここで話題になるのは以下のような疑似クラス first-child last-child nth-child first-of-type last-of-type nth-of-type nth-last-of-type...
-
CSSで全画面オーバーレイを実装する方法&コード例オーバーレイ表示したいのは、例えばこんな場面。 画面全体を無効化したいとき 操作を一時的にブロックしたいとき こういうオーバーレイ、作れると意外と便利です。 そこで CSSで全画面オーバーレイを作る方法 を紹介します。 ...
-
CSSの :not が効かない時にハマりがちな3つの罠CSSで便利なのが :[crayon-670bcd065717d075097853-i/] という疑似クラス 全体に対して [crayon-670bcd0657184072448042-i/] するとき、 全div要...
-
CSSだけで横スクロールできるリストを作ってみたアイテムを横スクロールできるリストを作りたい・・・ そう思ったので、色々調べて作ってみました。 思いのほか簡単に作れたので、 ここでは CSSだけで横スクロールリストを作る方法 をまとめときます。 横スクロールさせるのに...
-
FontAwesomeのアイコンを等幅にして見栄えをよくする方法タイトルにも書いた通り。 FontAwesome のアイコン幅のせいで見栄えが悪いことがありました。 でもその解決策が分かったので、 FontAwesomeでアイコンを等幅にする方法&CSSコード を紹介します。 アイコ...
-
flexの上位互換?超便利な display grid の使い方&コード例あまり使うことが少なかった [crayon-670bcd0657dfc304247874-i/] について。 今まで「 [crayon-670bcd0657e03936634120-i/] だけでいいじゃん」 とか思...
-
Bootstrapのドロップダウンが動かない時にありがちな2つの原因Bootstrapのドロップダウンメニューを作っていた時、、、 なぜかドロップダウンが動かない 何回クリックしても反応しない なぜか分からず数時間過ごす・・ みたいなムダな時間を過ごしてしまいました。 そこで将来の自分へ...