Highlight Matching Tag（Visual Studio Code 擴充功能）：HTML 開始與結束標籤強調與標示

2020/03/02 1,724 1 軟體應用 , 網站技術 , HTML

「Visual Studio Code」是由微軟（Microsoft）開發的開放原始碼程式編輯器。

之前開發 JavaScript 就有找到一款擴充功能（參考：Bracket Pair Colorizer）可以將上下括弧的區域標示出來，使程式撰寫更加容易，但 HTML 標籤同樣是有區域的，就是由開始標籤 <標籤名稱> 與結束標籤 </標籤名稱> 所框住的指定區域，但預設卻沒有標示，覺得有些不便！後來終於發現這款 Highlight Matching Tag 擴充可以做到最理想的效果，安裝後只要點擊 HTML 開始或結束標籤，就會有底線標示兩邊的標籤方便了解其包住的原始碼區域（片段），超讚！開發者還有給除了底線外的標示形式，可以看官方文檔自行設定。


▲ 請至 Visual Studio Code 延伸模組市集搜尋「Highlight Matching Tag」找到擴充後安裝。

▲ 安裝後開啟 HTML 檔案就會生效囉！預設是底線標示開始與結束標籤。

贊助廣告 ‧ Sponsor advertisements
【架站資源】ihost.tw免費虛擬主機服務
📆 2014-01-23
📁 網站技術, 伺服器, 架站資源
Google 相機 & StereoPhoto Maker & Facebook：用一般的手機輕鬆建立 3D 照片！景深 3D 照完整...
📆 2019-04-19
📁 軟體應用, 多媒體, 行動平台, 行動裝置, APP應用, Android, 靜圖處理
Stable Diffusion web UI x Waifu Diffusion：本機 AI 生成高品質二次元動漫角色
📆 2022-11-02
📁 軟體應用, 人工智慧, AI繪圖
無縮圖
CSS:文字大小、顏色以及動態效果
📆 2013-01-01
📁 網站技術, CSS
Sky Follower Bridge：快速同步 X (原 Twitter) 追蹤至 Bluesky 的瀏覽器擴充元件
📆 2024-10-18
📁 軟體應用, 瀏覽器, Google Chrome, Firefox, Edge, 擴充元件
Mozilla Firefox:手動開啟搜尋引擎建議功能
📆 2014-12-02
📁 軟體應用, 瀏覽器, Firefox
WSL（Visual Studio Code 擴充功能）：快速編輯 WSL 中的程式或檔案
📆 2023-04-21
📁 軟體應用
VidCoder:壓縮影片至指定大小
📆 2015-07-08
📁 軟體應用, 多媒體, 影片編輯

留言區 / Comments

萌芽論壇

萌芽站長

您好，我是萌芽系列網站（Mnya Series Website）的站長&創始人，可以稱呼我「萌芽站長」。我的興趣與專長有登山、觀察地形、攝影、旅遊、網頁設計＆架設＆經營、動畫製作、圖片處理、資料彙整等。有任何問題或建議請至萌芽論壇發表。網站業務、商業合作的聯絡方式在「關於本站 → 團隊介紹 → 站長介紹」，很高興認識您！請多指教！