HTML
💾 保存しても変更が反映されない
ブラウザを手動で更新していない
😰 こんな症状
ファイルを保存したのに、ブラウザの表示が変わらない。コードを書き始めたばかりの初学者が最初に戸惑うポイントだよ。
🔍 原因
ファイルを保存しただけではブラウザは自動で画面を更新しないよ。ブラウザは「表示を更新して」と言われるまで、前に読み込んだ内容をそのまま表示し続けるんだ。Live Serverを使っていない場合は手動でリロードが必要だよ。
❌ エラーが起きるコード
<link rel="stylesheet" href="style.css">
<!-- style.css を編集したがブラウザに反映されない --> ✅ 直し方
1. ブラウザでCtrl+R(MacはCmd+R)を押してページを更新する。 2. それでも反映されない場合はCtrl+Shift+R(スーパーリロード)を試す。 3. VS CodeのLive Server拡張機能をインストールすると、保存のたびに自動更新されるようになるよ。
✅ 修正後のコード
<!-- ブラウザで Ctrl+R (Mac: Cmd+R) を押してリロード -->
<!-- それでもダメなら Ctrl+Shift+R でスーパーリロード --> この解決法は役立ちましたか?
🔗 関連するエラー
- スタイルが反映されない — CSSファイルが読み込まれていない
- metaタグが反映されない — metaタグの位置や属性が間違っている
- meta descriptionが検索結果に反映されない — メタディスクリプションが無視される
- input の autocomplete が効かない — inputのautocomplete属性が効かない
- 画像が表示されない — 画像パスが間違っている
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- HTMLとは?初心者向けにわかりやすく解説 — タグの書き方・ページ構造の基本
- HTMLのパス(相対パス・絶対パス)の書き方 — パスの書き方を初心者向けに解説