サイト構築 WordPress キャッシュ無効化
ブラウザの「戻る」をクリックした際に表示されないケースがあったキャッシュを無効化することで、強制読込になるので、functions.phpに下記の処理を追加した。// キャッシュ制御を無効化function disable_browser_...
サイト構築
サイト構築 サイト構築 半角スペース（ ）
HTMLで半角スペースを表現するためには、エンティティ（entity）を使用します。半角スペースに対するエンティティは です。 を使うことで、半角スペースを HTML 文書内で挿入することができます。このエンティテ...
サイト構築 背景を画像で埋める
body { /* 画像のURLを指定 */ background-image: url('path/to/your/image.jpg'); /* 画像をカバーするように調整 */ background-size: cover; /* 画...
サイト構築 CSSセレクタ 親要素指定
:has()という疑似クラスで対応できるじゃん！例えば下記のような状態の時、labelタグを指定するには、label:has(>input)でイケちゃう。まぁ、普通にidを割り振って欲しいけど。<label> <input type="ch...
サイト構築 CSS : アコーディオン２
アコーディオンの上に罫線を入れてみたパターンdetails に with-topline のクラスを与える。<!DOCTYPE html><html lang="ja"><head> <title>アコーディオンに関する操作</title>...
サイト構築 CSS : アコーディオン
detailsにsummary、というタグを使用するそうで。 inputのtype="checkbox" で対応していたのも今や昔、勉強しないとどんどん知識が古くなる。悔しいがどんどん楽になる。それがHTML。シンプルにダイレクトに書けるな...
サイト構築 画像の取り扱いについての考察２
正方形のフレームを作る際に面白い方法があったので、サンプルを作成した。下記の square クラスがそれにあたる。height : 0; とし、padding-bottom で同じだけの割合を指定すると正方形になる。ただし、背景を着色すると...
サイト構築 画像の取り扱いについての考察
画像を上下中央に寄せるには下記のソースのフレーム設定（.frame）が肝である。display: flex; で上下中央に揃えるようにする。そうかその手があったか。<!DOCTYPE html><html lang="ja"><head> ...
サイト構築 object-fit
それぞれの値についてfill: 要素のボックス内における置換要素の中身を、ボックスに合わせて拡大または縮小します。アスペクト比は保持されません。contain: 要素のボックス内における置換要素の中身を、ボックスに合わせて拡大または縮小しま...
サイト構築 ２つに分けて左位置を縦書きで固定
フレームを作ってを2分割。片方を縦書きで表示させたい場合に少し悩んだのでできたもの。<!DOCTYPE html><html lang="ja"><head> <title>縦書きポジションに関するサンプル</title> <style t...