未分類
text
text
text
text
text
text
text
text
未分類 
css gridで横並びのコンテンツを上下中央で配置する方法
基本的にコンテンツを横並びにする場合はflexを使用して実装しますがflexではどうしても再現できないパターンがあります。
そんな時はgridで再現する方法がありますが、gridで横並びを作ると高さが画面幅に合わせて変化するコンテン...
css 余白のサイズを画面サイズに合わせて滑らかに変更したい時
デザイナー：このデザイン通りコーディングお願いします
エンジニア：これ、画面幅縮めると文章が改行されますけどいいですか？
デザイナー：ダメで...
css 電話番号を書く際のおすすめの書き方
電話番号をwebサイトに記載する場合、どのようなタグで囲み、書いていますか？
タグによってはブラウザ判断で意図しないスタイルが当たってしまったり、そのスタイルを上書きできないという場面があったりします。
電話番号はaタグ＋h...
cssの武器 SVGをcssからパスとして管理
SVGファイルは画像としてフォルダに入れて管理し、imgやbackground-imgなどで呼び出して使うのではなく、cssからパスとして管理することをおすすめします。
デモと結論
デモ
コード
mixin.scss
st...
ワードプレス テスト環境の作り方
すでに運用されているwebサイトを改修する作業を行いたい場合、いきなり本番サーバーを使用し開発することはとても危険です。
変更してはいけないものやデータを消去してしまった場合に取り返しのつかないことになってしまいますし、制作過程をユー...
未分類 本番反映（デプロイ）に失敗しないための対策
制作したコードを本番環境に反映させる際に失敗しない方法と間違ったコードを上げてしまい、サービスが停止してしまうなど取り返しのつかないことにならないように対策と作業手順を紹介します。
すでに存在しているファイルを修正し、アップデートする...
js jqueryで絞り込み機能を作る方法（プラグインなし）
絞り込み検索機能の作り方
記載方法はES6です
実行ではES６のバージョンを落として実行しています。
*メモレベル
コード
使い方
今回の実装のポイント
配列に任意の値が存在するか調べる方法
...
css calcの計算式のルールcalcが使えない時は単位に気を付けろ
フォントサイズや余白のサイズを計算して指定することができるcalc。とても便利ですよね。
calcを使えば横幅を３つに均等に分けたい時など、33.33...%と割り切れない数字を100% / 3と書いたり、画面幅に合わせて幅を変更した...
html 【プラグインなし】jQueryでスライダーを作る方法
webサイトのメインビジュアルによく使用される写真がスライドして切り替わるやつ。
あれを作ろうと思います。
プラグインのswiper.js（スワイパー）を使用すればかなりクオリティーの高いスライダーを作ることは可能ですが、プラグ...