【図解】レジの支払いはデザインのレイアウトの基本的要素がすべて詰まっている
デザインとは 辞書的には デザイン（design） ［名］(スル) １ 建築・工業製品・服飾・商業美術などの分野で、実用面などを考慮して...
「2019年04月」一覧
バッチ(bat)で任意の文字入力待ち→入力→確認→完了 を作成
ウェブの入力フォームのようにWindowsのバッチで再現します。再現するためには入力を受け付ける「SET /P」と画面遷移のように確認→...
【flex縦レイアウト】高さを指定せず真ん中伸ばして底の要素を固定し余白埋める
flex-growで余白をコントロール 下のような縦レイアウトで真ん中の要素を伸ばして底の要素を固定したいときflexを使うと簡単に実...
【PHPなし】CSSで長い文字列を省略！末尾を三点リーダー[…]にし崩れ防止する
動的に記事を出力するとき、通常であればPHPを使って文字列を省略してきました。しかしPHPがわからない、仕事でシステムの人に頼むのも面倒...
CSSを使ってマウスオーバー(hover)で画像の拡大する
transform:scale(1.3) マウスオーバーのアクションは色を反転させたり、少し透明にしたりいろんなアクションがあります。...
【gif有】pointer-eventsを使って重なり順(z-index)が下の要素をクリック可能にする
pointer-events: none; 「pointer-events: none;」はマウスイベントを無効するものですが、要素が...
【一行のみ】CSSを使い画像を中央でトリミングしはみ出し切り取る
object-fit: cover 画像の横幅と縦幅を固定し動的に画像を出力したとき、縦横比が崩れてしまいます。これに対応する場合、意...
レスポンシブ対応のときなどflexboxを使って順序を入れ替える
flex-flow: row-reverse レスポンシブ対応などで順序を逆転したいときがあります。 そのときはたった一行で逆転します...