CSS 【爆速コーディング】Visual Studio CodeのEmmetでサジェストされるコードをカスタマイズする！
Visual Studio CodeとEmmet
Visual Studio Code、通称VScodeは、拡張機能を追加することで、自分が使いやすいようにしていけるコードエディタアプリだ。MicroSoft製。
そし...
CSS
CSS 
CSS 【Shopify】商品ページのカラーバリアント選択をサムネイルタイプのボタンにし、メインスライダー画像と連動させる！
同じ要件の案件だと、これまではアプリを使用して実装していましたが、この度アプリなしで実装できたので、その備忘録として。
やりたいことはこれ！
これをしたくてもスライダーとバリアント選択同期が対応していない古いテーマの部...
CSS 【コピペでOK！】CSSでテキストの文字色をグラデーションに！
コードは以下です。
See the Pen
gradation_text by Naoto Yoshikawa (@nanaironanaoto)
on CodePen.
あらためてコードを解説しますと、
...
CSS 【あまりにもよく使う右向きアイコンのSVG】chevron（シェブロン）のsvgコードをワンコードで使い回す方法
タイトルにも記載した通り、
よくよく見回すすと、このアイコンを実によく見かけると思う。
参考) bootstrap opensource icons
その名は"chevron"（シェブロン）
...
CSS 【CSS,jQuery】input type=”file”のデザインをカスタマイズする【アップロード時のアニメーション,ファイル上限オーバー時のアラートも！】
画像ファイルなどをアップロードできる<input type="file">タグだが、何も手を加えないとこのような見た目になる。
iPhone（iOS）での表示
Windowsでの表示
OSによ...
CSS 【CSS,jQuery】HTMLをハックするcss,jQueryあれこれ
form内でバリデーションエラーになった要素にスクロールで移動する
テキストエリアのフォームに文字を入力されないでclickを押すと その箇所までジャンプしてフォームが赤くなる、など。
必要になったときに引き出しがないと意外と...
CSS 【開発環境】Tailwindで爆速コーディング環境を作る！
ShopifyにしろWordpressにしろ、liquidやphpを組み込む前に、ローカルで静的にHTMLを作成しておくと無駄のないきれいなコードでページを設計しておける。
その際に静的コーディングが爆速でできるとありがたい。という...
CSS 【ローカル環境開発高速化】reloadコマンドを使って、テキストエディタ更新時にブラウザプレビューを自動同期
reloadコマンドとは？
ECのCMS上で商品ページのが LPのように一枚一枚が作り込まれているとき、大量の画像をアップロードしたり、このページのみに使われるようなスタイルをあてた、読み物コンテンツのページを効率的に作る手順では、...
CSS 【ローカルHTML開発】ローカル環境でホットリロードのブラウザ開発環境を作る！
ローカル環境でネット接続もせず、飛行機の中でも核シェルターの中でも、超サクサクと限りなくストレスなくコーディングしたい方向けです！
こんな感じで高速でページを作成できます！
テーマにならい手順を高速で紹介します！
...
CSS 【iOS版Sublime Text!?】GoCoEditが神がかってきた件(おまけ:Inspect)
いつの間にか、こんなにできる子に！"GoCoEdit"
先日、愛機のデスクトップで作業していて、ある壁にぶつかり、なんで〜なんで〜と進めずに苦しんでいて、とりあえず頭休めようと、寝たんですが、寝てる時も、あれをこうして、これをああす...
CSS 【Webフォント】丸わかり！使えるWebフォント一覧【プレビュー＆設置コードつき！】
自由にフォントが使用できる印刷媒体と違い、Webでは表示できるフォントに制約があることを忘れてはいけません！
デザイナーによってかっこよく仕上げられたWebサイトのカンプがクライアントに大好評！
だけどコーディングに入り、「あ...
CSS 【HTML】ユーザのOSがダークモードならWebサイトもダークモードに！
いまさらながらダークモードとは！
一度体験してから、大好きになったダークモード。
いちおう説明しますと、ダークモードとは、Windows、Mac OS、iOS、Andoroidなど最近のOSでは切り替え設定ができるようになった...
CSS CSS,jQueryでよく使うコードまとめ（2021/04/26版）
タイトルの通り、よく使うやつを備忘録としてもまとめてみました。こんな感じで定番の型はアーカイブしていって順次1ページに集約していきたいと思います。
ちなみにサムネイルの画像は僕が別名義で運営する二次元系のブログサイトのメインビジュア...
CSS 【CSSだけで作る】高性能ドロワーメニューの決定版（2021/5/8追記）
CSSだけでクォリティの高いドロワーメニューの作り方！
前回の定番のスライダーのコードに続き、自分用の備忘録として。
サイト作ってると、これも毎回必要になってくる「ドロワーメニュー」（ハンバーガーメニューとかとも言われます）。...