nico

CSS

【独りごと/CSS】擬似クラス「:has」がめちゃくちゃ便利!

すみません、独りごとです。 特定の子要素を持つ親要素へスタイル付けができる擬似クラス、:has。今までjsを使わないとできなかったことがCSSだけでできるのはうれしい! 使いたいけど、Firefoxが非サポート(2023年1月現在)、、早く...
その他

スターサーバーに移行したので、おすすめポイントを紹介するよ!

長らくさくらのレンタルサーバを使ってきましたが、諸事情によりスターサーバーに移行しました。移行にあたり、何を基準にサーバーを選んだか、スターサーバーにした決め手、などを紹介します。 サーバー移行のきっかけ 元々は、Web制作の勉強を始めた頃...
WordPress

WordPressでサイト構築するときの考え方

ひとくちに「WordPressでサイト構築できます!」と言ってもどこまでやるか、その基準って人それぞれだったりしますよね。 自分以外の人が構築したサイトを触らせてもらうともったいない作り方してんな、、みたいなことも結構あるので、今回は、自分...
スポンサーリンク
CSS

【CSS】position: fixed; が、content-visibility が原因で固定されなかった話

WordPressのとある既存テーマをカスタマイズしていたときにposition: fixed;を付与したのに、固定されずスクロールしてしまう現象に遭遇しました。原因を突き止めてみたら、至極当たり前のことでした。考えたら当たり前なんだけど、...
JavaScript

【JavaScript】入力された電話番号に自動でハイフンを追加するTips

電話番号のハイフン入力が必須のフォームでハイフンの入れ忘れが多くて困ってる、との相談が。人間は忘れる生き物なので、そらそうだ。それならハイフンを自動で追加することはできないものか? と思い、作成しました。紹介するコードをコピペで使えますので...
PC

Macが重い人へ。Macを快適に使うために試したい対処法

Macって、ずっと使ってると重たくなりますよね!!!あの虹色のくるくるが出ると作業がその都度止まって進まない!それでは困っちゃうので、対処するためにやったことをいろいろまとめました。 【Macを快適に使うために】日常的にやろう! デスクトッ...
CSS

CSSでn個目系を指定する擬似クラス「:nth-child」「:nth-of-type」の、よくわかる解説

CSSで、要素の何番目かを指定する擬似クラス(ここでは勝手に「n個目系」と呼びます)を使う機会は多いのに、出てくるたびにググってる気がしたので、備忘録としてまとめました。 n個目系擬似クラスの種類 n個目系擬似クラスには、以下の種類がありま...
WordPress

Cocoonの子テーマを有効化すると画面が真っ白になってどハマりした話

クラシックエディタでゴリゴリ更新してた当ブログですが、いつまでクラシックエディタがサポートされるのかもわからないし、世の中にノーコードが浸透しつつあるのを感じブロックエディタにも慣れておきたいな(今更)ということで、大幅にリニューアルするこ...
PC

MacBookProで、Wi-Fiが繋がってるのに繋がらなかった話

不思議な現象に遭遇しました。Wi-Fiが繋がってるのに繋がらないんです。 日頃、自宅やコワーキングなどでは通常通りにWi-Fiを使えているのですが、何故かとあるコワーキングスペースだけ、ネットワーク接続ができないのです。コワーキングで提供し...
CSS

コピペでOK!画像を使わずCSSで三角形をつくる方法×2

以前なら三角形は画像一択でしたが、単純な三角はCSSで表現が可能です。三角形のジェネレーターも存在しますが、今回はコピペでサクッと使えるような、頻出する三角形のコードを紹介します。 1.塗りつぶしの三角形 まずは、塗りつぶしの三角形を紹介し...
スポンサーリンク