2022-10-01から1ヶ月間の記事一覧
input[type="radio"] を利用した CSS だけで作るタブ 作ったやつ! See the Pen Tab without JavaScript by KIKIKI (@kikiki_kiki) on CodePen. HTML <div class="tab"> <input type="radio" id="tab1" name="tab" checked /> <input type="radio" id="tab2" name="tab" /> <input type="radio" id="tab3" name="tab" /> </div>
WordPress で OGP の情報を出力するには All in One SEO などのプラグインを使えば実現できるのですが、WordPress からしばらく離れていたこともあり WordPress 独特のプラグインが GitHub にない場合も多くスター数やどれが現段階でのベストプラクティスな…
wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), $size ); で画像の URL を取得するのが良さそう
Contact Form 7 の DOM をカスタマイズする時は wpcf7_form_elements フィルターを使えばOK
あるCSSカスタムプロパティ(CSS変数)で定義してある数値を反転させた値で使いたいケースが稀にあります。 例 例えば親要素の padding をネガティブマージンで打ち消したいような場合、padding, negative margin の量を CSSカスタムプロパティ(CSS変数)にでき…
CSS 完全に理解した!!!! [ネタ投稿]
Workbench > Settings: Editor を json にすれば OK!
タイトルのままです。 CSS 変数はメディアクエリ (@media) のブレイクポイントの値には使うことができないようです。 CSS 変数をブレイクポイントにしても動作しない :root { --breakpoint-md: 48em; } @media (min-width: var(--breakpoint-md)) { body { c…
前回までのあらすじ ターミナルをいい感じにする設定のメモ ほぼ こちらの記事 のままです 環境・前提 Mac Book Air M1 (2022) mac OS Monterey Homebrew インストール済み 設定ファイルの準備 ~/.zshrc に設定を追加していく。~/.zshrc がない場合は作成す…
2017 年から使ってた Intel Mac ちゃんにお別れして新しい M2 Mac Book Air に買い替えてクリーンインストールしたので開発環境を再構築下のメモ ※ これは Zenn にメモしてたものを再録したただけの記事です 環境 Mac Book Air M2 (2022) macOS Monterey 12.…
React の勘を取り戻す素振りで tooltip コンポーネントを作ってみた。(車輪の再発明) hover で表示するシンプルな tooltip tooltip と表示する対象を同じ div で囲ってしまって親要素の hover で tooltip を表示させる // Tooltip.tsx import { FC, ReactNod…