【Visual Studio Code】HTMLの補完機能(Tabキー)が効かない時の対処法

目次

環境情報

  • OS:Windows 10 Pro
  • バージョン:20H2

エラー発生の経緯

現在、Flaskの勉強中に、
普段使用しているiOSではなく、Windows環境にてVisual Studio Codeを使い始めました。

そこで、HTMLファイルを編集している際、
Tabキーでの補完機能(Emmet機能)が効かない問題に直面しました。

実施した対処法

Visual Studio Codeの設定を変更することで解決しました。
具体的な手順は以下の通りです。

1. Visual Studio Codeの設定画面を開く

  • 画面左下の「管理ボタン(歯車アイコン)」をクリック
  • メニューから「設定(Settings)」を選択

2. 設定検索を行う

  • 上部にある「設定検索」のバーに、
    Trigger Expansion On Tab
    と入力します。

3. Emmet設定を有効にする

  • 検索結果に表示される
    Emmet: Trigger Expansion On Tab
    という項目を探します。
  • その右側にあるチェックボックスにチェックを入れます

これで設定は完了です。

4. Visual Studio Codeを再起動する

設定を反映させるために、
Visual Studio Codeを一度終了して再起動します。

これにより、HTML編集時に、
htmldivなどと入力したあとにTabキーを押すと、
自動でHTMLタグを補完できるようになりました。

まとめ

今回の問題は、Visual Studio Codeの
Emmet補完機能がデフォルトで無効になっていたことが原因でした。

「Trigger Expansion On Tab」を有効化するだけで、
無事、HTMLの補完機能が使えるようになりました

このように、設定を一つ見直すだけで大きく作業効率が改善することもあるため、
問題に直面した際は、慌てずに順番に設定を確認していくことが大切だと感じました。

副業から独立まで「稼げる」Webスキルを習得する(PR)

ここまで読んでいただきありがとうございます。 最後に宣伝をさせてください。

「副業を始めたいが、何から手をつければいいかわからない」「独学でスキルはついたが、収益化できていない」という悩みを持つ方には、マンツーマン指導のWebスクール**「メイカラ」**が適しています。

このスクールは、単に技術を教えるだけでなく、**「副業として具体的にどう稼ぐか」**という実務直結のノウハウ提供に特化している点が特徴です。

講師陣は、実際に「副業Webライターから1年で独立して月収100万円」を達成したプロや、現役で利益を出し続けているブロガーなど、確かな実績を持つプレイヤーのみで構成されています。そのため、机上の空論ではない、現場で通用する戦術を学ぶことができます。

副業に特化した強み

  • 最短ルートの提示: 未経験からでも実績を出せるよう、マンツーマンで指導。
  • AI活用の習得: 副業の時間対効果を最大化するための、正しいAI活用スキルも網羅。
  • 案件獲得のチャンス: 運営がWebマーケティング会社であるため、実力次第で社内案件の紹介など、仕事に直結する可能性があります。

受講者の多くは、「在宅でできる仕事を探している」「副業を頑張りたい」という20代・30代・40代が中心です。

受講前には、講師による無料説明が行われます。無理な勧誘はなく、自分に合った副業スタイルやプランを相談できるため、まずは話を聞いてみることから始めてみてはいかがでしょうか。

ブログで稼ぎたいなら「メイカラ」

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

私が勉強したこと、実践したこと、してることを書いているブログです。
主に資産運用について書いていたのですが、
最近はプログラミングに興味があるので、今はそればっかりです。

目次