HTMLcatへようこそ。これは、覚えておく価値のある小さなネイティブWebトリックのコレクションです。各 post-it は、プラットフォームの便利な機能と最小限の例、そして重要な注意点を組み合わせます。ノートは HTML、CSS、JS の安定、限定、実験的機能をカバーします。サポートラベルを確認し、フォールバックを保持し、実際のブラウザと支援技術でテストしてください。\n\n注目のトリックには、デバイスタイプ検出、スクロールバーの非表示、空タグ、CSSセンタリング、`clamp()`、スムーズスクロール、スクロールマージン、`classList.toggle()`、電話・メールリンク、テキスト選択ハイライト、`:has()` リレーショナルセレクタ、`::marker` でリストマーカーをスタイリング、`Intl.NumberFormat` でローカライズされた価格、`inert` でサブツリーを無効化、`:target` 擬似クラス、`translate` 属性、`prefers-color-scheme`、コンテナサイズクエリ、`<dialog>` 要素、`text-wrap` でより良いラップ、説明リストの整列、`accent-color` でネイティブフォームカラー、CSS カスタムハイライト API、入力タイプでのホバー検出、`color-mix()` で透明色、スクロールスナップイベント、`light-dark()`、`contrast-color()`、`@scope` でスコープ付き CSS、`:where()`、スクロール駆動アニメーション、CSS カルーセル、`corner-shape`、CSS カスタム関数、CSS Grid レーン、Popover API、View Transitions API、コンテナスタイルクエリ、`details` 名の排他アコーディオン、ボタンコマンドでダイアログを制御、`hidden=until-found` で検索可能な折りたたみコンテンツ。\n\nすべての例はタイトルとコンテンツで検索可能です。ブラウザのサポートを確認し、プロダクション用にフォールバックを提供することを忘れないでください。
出典: Hacker News · 要約：HeadlinesBriefing