サイト構築 -実装
漢字もたっぷり揃った新作筆文字フォント！ 7000文字すべて完全手書き、商用利用可の日本語フォント -しょかき ささぶね
Post on:2022年9月7日
「しょかきさらり」「しょかき鱗片」「しょかきうたげ」「しょかき楷月」（すべて無料版あり）をリリースされているぼんのう堂様から、新作フォント「しょかき ささぶね」がリリースされました！ ひらがな・カタカナ・英数記号文字、漢 […]
モーダル要素の実装に便利なCSSの新機能「:modal疑似クラス」、主要ブラウザのすべてにサポートされました
Post on:2022年9月6日
先日リリースされたChrome 105, Edge 105でコンテナクエリ（@container）と:has()疑似クラスがサポートされ、モダンCSSの新機能がいよいよブラウザで使用できるようなりました。 そしてもう一つ […]
CSSの@mediaは、スクリーンサイズだけじゃない！ 最近の実装で使用されるメディアクエリのまとめ -mediaquery.style
Post on:2022年8月30日
Webサイトやスマホアプリの実装でよく使用される、CSSのメディアクエリのコードを紹介します。 モバイルファースト用をはじめ、ライトモード・ダークモード用、アクセシビリティ、ホバーエフェクト用、デバイスの向き用など、さま […]
レスポンシブの実装が今までと変わる！ CSSの新機能コンテナクエリと:has()疑似クラス、最初に理解しておきたい基礎知識を解説
Post on:2022年8月25日
CSSの新機能コンテナクエリ（@container）と:has()疑似クラスが、いよいよChrome 105（8月末、来週リリース予定）でサポートされます。 コンテナクエリとは今までのメディアクエリがビューポートに依存し […]
神アップデート！ Win, Mac, Linux対応、クラウドでの同期機能も備えた最強のコードスニペットマネージャー -massCode
Post on:2022年8月24日
HTML, CSS, JavaScriptをはじめとしたさまざまな言語に対応、クラウドでの同期機能も備えたオープンソースのコードスニペットマネージャー「massCode」がv3に神アップデートされたので、改めて紹介します […]
永遠にスクロールしていたくなる、気持ちいいエフェクト -Intersection Observer Scrolling Effects
Post on:2022年8月23日
Intersection Observerとカスタムプロパティを使用して、グリッドやリストのスクロールビューにアニメーションを適用するテクニックを紹介します。 アニメーションはスクロールに連動して動作し、GridやLis […]
カラー生成のこんな便利ツールがあったとは！ ベタ塗りのカラーと同じに見える半透明のカラーを生成するツール -Alphredo
Post on:2022年8月22日
同じ背景色に配置したベタ塗りのカラーと同じに見える半透明のカラーを生成するツールを紹介します。 半透明のカラーは背景に重なると、ベタ塗りのカラーと同じになります。たとえば、シャドウやダイアログの背後の背景など半透明で複数 […]
ブックマークしておくと便利！ 背景、テクスチャ、パターン、シェイプ、グラデーションなどを生成するSVGツールのまとめ
Post on:2022年8月10日
WebサイトやスマホアプリのUIデザイン、イラストなどにもぴったりな背景、テクスチャ、パターン、シェイプ、グラデーション、装飾グラフィック、カラーパレットなどのSVGを生成するオンラインツールを紹介します。 ネオンカラー […]
この発想はすごい！ モダンCSSで実装する、ボーダーをアニメーションさせるテクニック
Post on:2022年8月9日
モダンCSSで実装する、ボーダーをアニメーションさせるテクニックを紹介します。矩形のHTMLはdiv要素1つだけ、ボーダーがどのようにアニメーション化されているのか、その仕組みが視覚的に分かるデモもあります。 CSS b […]
VS Codeの新機能がすごく便利！ JavaScriptやCSSの関数やクラスなどを上部に固定させる「スティッキー スクロール」
Post on:2022年8月8日
8/5にアップデートされた、VS Code v1.70で「スティッキー スクロール」を使用できるようになったので、紹介します。 JavaScriptやCSSで作業しているときに、関数やクラスなどが自動でスティッキーされ、 […]
sponsors
