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