首頁  >  文章  >  web前端  >  HTML程式碼如何格式化

HTML程式碼如何格式化

清浅
清浅原創
2018-12-07 15:20:2511513瀏覽

HTML程式碼可以透過sublime中的內建指令Reindent對程式碼格式化,也可以安裝HTML-CSS-JS Prettify外掛程式對程式碼格式化

有時候我們將別人的程式碼複製過來的時候發現程式碼排列的非常雜亂無章,無法去閱讀程式碼,今天就將和大家介紹如何使用sublime中的插件去格式化程式碼,有一定的參考作用,希望對大家有所幫助。

【推薦課程:HTML課程#】

HTML程式碼如何格式化

(1)Sublime的內建Reindent指令

開啟路徑:Edit-->Line-->Reindent

HTML程式碼如何格式化

##但是sublime自帶的重新縮排功能較為單一,只是保證縮排正常了而已。而對於程式碼中寫法不規範的地方,無法進行處理,它適合在簡單的場景下使用,如果有複雜的情況需要安裝插件

(2)HTML-CSS-JS Prettify插件

這個外掛程式可用於Sublime Text 2和Sublime Text 3,可以用來處理HTML,CSS,JavaScript以及JSON檔案

先安裝外掛:

ctrl shift p開啟Package Control: 然後選擇install package中輸入HTML-CSS-JS Prettify外掛程式並按下enter鍵,重新啟動sublime

外掛程式安裝成功,因為HTML-CSS-JS Prettify外掛程式的使用需要Node.js運行,因此我們還要安裝node.js軟體,下載好後操作一下步驟「在開始--搜素檔案和程式--cmd」

HTML程式碼如何格式化

然後在sublime中開啟一個html文件,點選右鍵選擇HTML-CSS-JS Prettify下的Plugin Options檔案打開,將路徑改為安裝node軟體的路徑,如下圖

Image 13.jpg

在此外掛程式安裝成功

未格式化之前:

Image 14.jpg

#格式化之後:

HTML程式碼如何格式化

HTML-CSS-JS Prettify外掛程式它沒有刪除檔案中的額外空白行或縮排<script>區塊內的JavaScript ,是非常好的外掛程式</script>

#(3 )HTMLBeautify

該HTMLBeautify外掛程式是假設你的HTML已經部分與單獨的行標籤格式的一個基本的腳本。它對內聯註解不起作用

(4)TidyHTML5

#如果您只對格式化HTML5感興趣,可以選擇TidyHTML5外掛程式。雖然它使用外部實用程式來執行格式化,但它為Windows用戶捆綁。

總結:以上就是這篇文章的全部內容了,希望對大家學習使用sublime有一定的幫助。

以上是HTML程式碼如何格式化的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn