css flexboxで最後の行を左揃えにする
あちこちで書かれていますがよく使うのでメモHTML<div class="box"> <div class="text">ボックス１</div> <div class="text">ボックス２</div> <div class="text"
css
css css tableのtrタグを非表示→表示させるには（初期値）
デスクトップとモバイルの切り替えで tableのtrタグを出したり消したりする 必要が出てきましたいつもこのやり方なので同じようにtrタグを非表示から表示させるときに display:block; を使うとあれ？見た目おかしい…調べた結果t
css MW WP Formのチェックボックスを縦並びにする（←2021.10.06追記）
Wordpressのフォーム用プラグインMW WP Formでチェックボックスを作成すると各チェックボックスとラベルのセットはspanタグで囲まれており、横並びになりますこれを縦にしたいとき各spanタグにはhorizontal-itemと
css 奇数、偶数、n番目を指定するcss
これも毎回調べてしまうのでメモ（背景を黄色に指定する設定）奇数:nth-child(odd){background:#ff0;}偶数:nth-child(even){background:#ff0;}n番目/*３番目のとき*/:nth-ch
css メディアクエリの書き方（モバイルファースト）
ブレイクポイントが１つ/* 768px以上のとき */@media screen and (min-width:768px) { }ブレイクポイントが２つ/* 768px以上1024px以下のとき */@media screen and (
css Flexboxベンダープレフィックス
Flexbox よく使うベンダープレフィックスまとめコピペ用flexboxdisplay: -ms-flexbox;display: -webkit-box;display: -webkit-flex;display: flex;flex-
css 横幅いっぱいの背景画像を縦横比を保ったままレスポンシブ対応
HTML<div class="box"></div> ← 背景を設定するボックスCSS.box{width:100%;height:0;padding-top:〇〇%; /* 画像の高さ÷幅×100*/background-size:co
css 横に並んだ画像とテキストを縦中央に揃える
見出しの前にアイコンを付ける時とか用①display:table-cellを使うHTML<div class="content"> <p><img src=""></p> <p>テキストテキスト</p></div>CSSdiv.conten
css マウスオーバーでふわっとさせるcss
cssa{ transition : all 0.3s ease 0s;}a:hover{ opacity:0.7;}これでリンク部分は0.3秒かけてふわっと自然に半透明になる最後の0sは始まるまでの時間（この場合はすぐに）easeは動き方
css レスポンシブデザインでPCとスマホで表示出し分け
レスポンシブデザインでデスクトップのみに表示したいものとスマホのみに表示したいものをわけるためデスクトップとモバイル表示切り替え用のCSSこれでclass="pc"をつけたものはデスクトップ（769px以上）のみ表示class="sm"をつ