Hbuilder特別版介紹

Hbuilder特別版是一款功能強大的HTML編輯器，支持多種程序語言，兼容發大部分瀏覽器數據。HBuilder免費版的生態系統可能是最豐富的Web IDE生態系統，因為它同時兼容Eclipse插件和Ruby Bundle。SVN、git、ftp、PHP、less等各種技術都有Eclipse插件。

Hbuilder特別版特色

1、內置代碼輸入法，按數字快速輸入候選項。

2、可編程代碼塊，一個代碼塊，少敲50個按鍵。

3、各種代碼提示，不僅僅是語法。

4、跳轉助手，手不離鍵盤。

5、多語言支持，輕松兼容。

6、邊看邊寫，效果實時展現。

7、護眼主題，關愛你的眼睛。

Hbuilder特別版亮點

編碼比其他工具快5倍夠不夠？對極客而言，追求快，沒有止境！

代碼輸入法：按下數字快速選擇候選項

可編程代碼塊：一個代碼塊，少敲50個按鍵

內置emmet：tab一下生成一串代碼

無死角提示：除了語法，還能提示ID、Class、圖片、鏈接、字體…

跳轉助手、選擇助手，不用鼠標，手不離鍵盤

多種語言支持：php、jsp、ruby、python、nodejs等web語言，less、coffee等編譯型語言均支持

邊改邊看：一邊寫代碼，一邊看效果

強悍的轉到定義和一鍵搜索

這里還有最全的語法庫、最全的語法瀏覽器兼容庫

Hbuilder特別版使用說明

打開文件夾，找到Hbuilder的啟動文件，然后郵件選擇發送到桌面快捷方式，這樣方便我們之后快速的啟動。

點擊桌面的Hbuilder快捷方式，打開我們的Hbuilder登錄郵箱進入到Hbuilder的工作臺中并進行一些基礎設置。

設置完成后，我們的Hbuilder就算是已經安裝好了，記下來我們就開始學習怎么使用它，首先我們新建一個web項目，之后命名，選擇存儲位置。

然后我們就可以打開這個文件，開始我們的代碼編寫之旅了，而且Hbuilder編寫代碼是由提示的，比如我們想創建一個塊元素div，那么我們輸入d后面就會出現相應的提示，大大的加快了代碼的編寫速度。

Hbuilder常用快捷鍵

1.文件(4)

新建 Ctrl + N

關閉 Ctrl + F4

全部關閉 Ctrl + Shift + F4

屬性 Alt + Enter

2.編輯(13)

激活代碼助手 Alt + /

激活快捷鍵視圖 Ctrl + Shift + L

開啟關閉注釋整行 Ctrl + /

開啟關閉注釋已選內容 Ctrl + Shift + /

刪除當前行 Ctrl + D

刪除當前標簽 Ctrl + Shift + T

刪除至行首 Shift + Backspace

刪除至行尾 Shift + del

合并下一行 Ctrl + Alt + J

整理代碼格式 Ctrl + Shift + F

向下移動行 Ctrl + 向下

向上移動行 Ctrl + 向上

選中當前行 Ctrl + L

3.插入(3)

重復插入當前行或選中區域 Ctrl + Shift + R

快速插入

(在html中) Shift + Enter

快速插入\n(在css或js中) Shift + Enter

4.選擇(4)

向左選詞 Ctrl + Shift + 向左

向右選詞 Ctrl + Shift + 向右

選擇相同詞 Ctrl + Shift + A

選擇成對內容 Ctrl + ‘[‘

5.跳轉(9)

上一個選項卡 Ctrl + Tab

前一詞 Ctrl + 向左

后一詞 Ctrl + 向右

轉到上一個文本輸入點 Alt + 向上

轉到下一個文本輸入點 Alt + 向下

行首 Home

行尾 End

頁首 Ctrl + Home

頁尾 Ctrl + End

6.查找(8)

搜索條 Ctrl + F

搜索框 Ctrl + H

查找文件 Ctrl + T

隱藏搜索條 ESC

聚焦到搜索條件框內 Ctrl + Alt + F

聚焦到替換輸入框內 Ctrl + Alt + E

在搜索條內換行 Alt +Enter

HTML標簽規范 Ctrl + Shift + H

7.運行(1)

運行 Ctrl + R

8.工具(1)

CSS/HTML語法校驗 Ctrl + Shift + V

9.視圖(6)

活動視圖或編輯器最大化 Ctrl + M

顯示行號菜單 Ctrl + F10

激活邊看邊改視圖 Ctrl + P

激活開發視圖 Ctrl + Shift + P

全部折疊 Ctrl + Alt + -

全部展開 Ctrl + Alt + +

Hbuilder實用技巧和常見問題

Q:怎么實現代碼追蹤？

A:在編輯代碼時經常會出現需要跳轉到引用文件或者變量定義的地方，HBuilder提供了一個非常好用的代碼追蹤功能，

只需要按住Alt+鼠標左鍵即可實現追蹤。

Q:編輯器怎么實現分欄？

A:HBuilder編輯器分欄功能可以實現左右分欄和上下分欄以及組合分欄。

1、左右分欄實現：鼠標點著編輯器選項卡往最右邊拖動 到最小化按鈕部分 即可實現左右分欄

左右分欄實現效果：

2、上下分欄實現：鼠標點著編輯器選項卡往最下邊拖動 到左右滾動條處 即可實現上下分欄

上下分欄實現效果：

3、組合分欄實現：組合分欄就是即有的文件向下拖動，有的文件向右拖動，下面給出一個效果圖，

感興趣的話您可以拖個試試：

Q:有沒有快速比較兩個文件差異的辦法？

A:比較兩個文檔的方法是，在項目管理器按ctrl選兩個文件，點右鍵，選比較對象

點擊查找-歷史版本比較，里邊保存有改=該文件的所有歷史版本代碼

Q:怎么才能快速記住快捷鍵？

A:記快捷鍵，不如記快捷鍵語法。

Alt是轉到，Shift是轉移，Ctrl是操作。

比如Alt+括號、引號，即使轉到對于的符號。

Shift+回車是<br/>，shift+空格是&nbsp;。

Ctrl+D是刪除行，F2是重構命名。

Q:為什么不能手機預覽？

A:WEB項目不可以手機預覽頁面。只有移動APP才可以。

確定項目是移動APP后,確保移動設備插好數據線并連接到電腦。

如果是iOS設備,請確保電腦安裝有itunes,如果是Android,請確定手機驅動已經安裝。

此時在HBuilder下方的狀態欄也會提示手機已連接

然后點運行,選擇對應的設備即可。

如果你只是想預覽web項目，那么在菜單工具->選項->HBuilder->web服務器->內建服務器里，

選擇一個內網ip，比如192.xxx，然后手機通過wifi連入這臺機器，即可預覽。

Q:如何修改使用瀏覽器預覽時,地址欄顯示的IP

A:依次點擊工具-選項-HBuilder-Web服務器-內建服務器

可修改內建服務器的IP地址為127.0.0.1或本機網卡IP

內建服務器不可以運行PHP

需要重啟HBuilder才生效

Q:真機聯調的Development圖標如何去掉？

A:真機聯調僅是為了制作手機APP，調試完畢后,需要將資源打包制作成為APP。

如果是為了在手機瀏覽器上使用的WEB應用，還是應該使用手機瀏覽器來訪問。HBuilder內置的web

服務器地址配成192.168等內網地址，手機wifi連入，即可訪問。

更改HBuilder內置的web服務器地址請點擊菜單工具-選項，展開左邊的HBuilder-web服務器-內建服

務器，在右邊更改地址，需要重啟HBuilder才生效

Q:沒有黑色主題嗎？

A:在菜單工具-視覺主題設置-高級設置里有各種主題，兼容eclipse的其他主題方案。

另外小小提示下，使用黑色傷眼。激發視紫紅質、消耗維生素A、還容易引發暗適應和暈眩。

綠柔主題是認真的研究了色彩心理學和生理學后制作的環保主題。

Q:如何調整編碼?

A:HBuilder1.7以前版本在資源管理中對著文件點右鍵，點屬性（快捷鍵是Alt+Enter）。

在文件編碼處選其他，選擇或輸入你需要的編碼，比如GBK。

1.8以上的版本可以在文件->其他編碼方式打開,選擇需要的編碼即可。

8、關于PHP

Q:PHP怎么運行?

A:HBuilder自帶的web服務器是不能解析php的。

如果想解析php，需要自己安裝php服務器，比如Apache。

安裝好后，在HBuilder的工具-選項-web服務器中點新建外部web服務器，配置地址和參數，保存后重啟HBuilder。

然后點運行即可。

Q:PHP怎么不高亮不提示？

A:PHP的語法高亮需要安裝PHP插件。

在工具-插件安裝中，可以安裝Aptana PHP插件。

如果確定安裝了php插件，那么在工具-選項，搜索文件關聯，在里面配置php文件和PHP Editor的關聯。

也可以在項目管理器里對文件點右鍵，打開方式，里面選PHP Editor。

Q:我怎么使用HBuilder編輯JSP、ASP或.vm文件中的HTML代碼部分？

A:HBuilder有很多文件編輯器。

右鍵點擊文件-打開方式，可以看到所有編輯器。

很多不常用的文件后綴名其實都可以通過HTML編輯器打開。

10、在Hbuilder中使用git

①安裝git插件：工具———安裝插件——EGIT。

②右擊項目文件——Team——共享項目，項目里邊的文件就會自動添加了一個倉庫小圖標：

③管理倉庫文件時：右擊文件 team，然后進行你需要的操作，commit、pull、push等