Brackets 擴充功能「Beautify & Indent Guides」:自動縮排美化與縮排層次標記
2018/09/20
萌芽站長
4,167 1
軟體應用 , 網站技術
Brackets
「Brackets」是 Adobe Systems 開發的一個以 HTML、CSS 及 JavaScript 編寫的 HTML 編輯器。
這邊要推薦兩個非常棒的 Brackets 擴充功能,可以分別達到自動縮排美化與縮排層次標記,讓編寫的網頁更加清楚明瞭!
🔸 Beautify - 將 HTML、CSS 及 JavaScript 原始碼自動縮排整齊排列。
🔸 Indent Guide - 自動將縮排層次標記出來,一眼就可以看出每個層次排列,編寫網頁更加輕鬆!
趕快依照著以下圖文為自己的 Brackets 擴充這兩個功能吧!😆
▲兩個箭頭指的地方都可以開啟「擴充功能管理員」。
▲搜尋「Beautify」,找到後安裝。
▲安裝畫面。
▲安裝成功後該擴充功能將出現在「已安裝」頁籤中。
▲這是一個完全沒有縮排的網頁。
▲按下剛剛「Beautify」擴充的快捷鍵「Ctrl+Alt+B」,網頁將自動縮排美化。接下來安裝「Indent Guide」擴充:
▲一樣到「擴充功能管理員」搜尋「Indent Guide」並安裝它。
▲之後就可以在「檢視」找到「Indent Guides」,點擊即開啟標記功能。
▲縮排層次已經清楚標記啦!是不是很棒呢?😊
贊助廣告 ‧ Sponsor advertisements
phpfmt(Visual Studio Code 擴充功能):PHP 格式化/自動美化工具
📆 2019-06-15
📁
軟體應用, 網站技術, PHP
Node-RED:開啟專案(項目)功能與建立首個新專案
📆 2021-12-02
📁
網站技術, Node.js, Node-RED
Node.js:jpg、jpeg、JPG、JPEG 通通不遺漏的進行壓縮(Gulp、mozjpeg 批次圖片壓縮 - 延伸篇)
📆 2019-09-30
📁
多媒體, 網站技術, JavaScript, Node.js, 靜圖處理, Gulp
JSP 網站瀏覽數統計實作:Tomcat & JSP 連線 MySQL 教學、隱含物件 Session 解說、程式詳解
📆 2019-06-02
📁
網站技術, 伺服器, 資料庫, 學業筆記, JSP, SQL
After Effects LoopOut Tip 循環指令詳細介紹
📆 2016-07-13
📁
軟體應用, 多媒體, 動畫特效
IcoFX-製作我的圖標
📆 2013-12-17
📁
軟體應用, 多媒體, 靜圖處理
Android Studio:「com.example」禁止使用,如何改用其他套件名稱?
📆 2021-11-17
📁
軟體應用, 行動平台, Android, APP開發
Telegram 8.0 for Android & Telegram Desktop 3.0 更新:直播串流、彈性轉傳、跳轉到下一個頻道、...
📆 2021-09-19
📁
軟體應用, 行動平台, 資訊新聞, APP應用, Android
留言區 / Comments
萌芽論壇