2025-07-01 | lain

CSSのレイアウトに迷う人へ。サウンドテストUIを題材に、flexとgridの使い分けから、スクロール領域・モーダル・レスポンシブ対応まで丁寧に解説します。実装前の復習におすすめ！

カテゴリ： CSS

タグ： #実践講座#CSS#UIデザイン#ゲーム開発#フロントエンド#レイアウト#Web制作#モーダルUI#Flexbox#Grid#レスポンシブ#音楽プレイヤーUI#WebUIデザイン#サウンドテスト#HTMLCSS教材#ゲームUI設計

2025-06-30 | lain

「DevTools入門：HTML/CSS/JavaScript開発に必要な基本5タブ」― Elements / Styles / Computed / Console / Network を使いこなす入口に

カテゴリ： DevTools

タグ： #入門講座#HTML#CSS#JavaScript#Elements#Styles#Computed#Console#Network

2025-06-16 | lain

一定時間ごとにおすすめ記事が1件ずつ変わるシャッフル表示を実装＆紹介。小スペースに複数を収めたい場合に◎。

カテゴリ： Hugo

タグ： #PaperMod#JavaScript#CSS#シャッフル表示#ランダム切り替え#ブログ#カスタム

2025-06-15 | lain

CSS＋JavaScriptを使い、記事カードをグリッド表示し、スクロールに応じてフェードインする演出を実装する方法を紹介

カテゴリ： Hugo

タグ： #PaperMod#JavaScript#CSS#フェードイン#グリッド展開#アニメーション#ブログ#カスタム

2025-06-11 | lain

Claude 3.5 Sonnetに自然言語で指示を出し、JavaScriptによる簡単なモグラ叩きゲームを生成。

タグ： #Claude#ClaudeCode#HTML#CSS#JavaScript#ゲーム制作#モグラ叩き#AI開発支援#コード生成AI#学習ログ#入門講座

2025-06-11 | lain

Poe上のClaude Sonnetを使って、自然言語からHTML＋CSSの静的Webページを作成していくプロセスを体験する入門編。

タグ： #Claude#ClaudeCode#HTML#CSS#Web製作#AI開発支援#コード生成AI#学習ログ#入門講座

2025-06-06 | lain

Hugoで記事に吹き出しメッセージを作る方法の紹介（Goテンプレート）

カテゴリ： Hugo

タグ： #吹き出しメッセージ#Goテンプレート#chat bubble#カスタム#CSS#HTML

カテゴリ：CSS