Hbuilder特別版介紹

Hbuilder特別版是一款功能強(qiáng)大的HTML編輯器，支持多種程序語(yǔ)言，兼容發(fā)大部分瀏覽器數(shù)據(jù)。HBuilder免費(fèi)版的生態(tài)系統(tǒng)可能是最豐富的Web IDE生態(tài)系統(tǒng)，因?yàn)樗�同時(shí)兼容Eclipse插件和Ruby Bundle。SVN、git、ftp、PHP、less等各種技術(shù)都有Eclipse插件。

Hbuilder特別版特色

1、內(nèi)置代碼輸入法，按數(shù)字快速輸入候選項(xiàng)。

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

3、各種代碼提示，不僅僅是語(yǔ)法。

4、跳轉(zhuǎn)助手，手不離鍵盤(pán)。

5、多語(yǔ)言支持，輕松兼容。

6、邊看邊寫(xiě)，效果實(shí)時(shí)展現(xiàn)。

7、護(hù)眼主題，關(guān)愛(ài)你的眼睛。

Hbuilder特別版亮點(diǎn)

編碼比其他工具快5倍夠不夠？對(duì)極客而言，追求快，沒(méi)有止境！

代碼輸入法：按下數(shù)字快速選擇候選項(xiàng)

可編程代碼塊：一個(gè)代碼塊，少敲50個(gè)按鍵

內(nèi)置emmet：tab一下生成一串代碼

無(wú)死角提示：除了語(yǔ)法，還能提示ID、Class、圖片、鏈接、字體…

跳轉(zhuǎn)助手、選擇助手，不用鼠標(biāo)，手不離鍵盤(pán)

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

邊改邊看：一邊寫(xiě)代碼，一邊看效果

強(qiáng)悍的轉(zhuǎn)到定義和一鍵搜索

這里還有最全的語(yǔ)法庫(kù)、最全的語(yǔ)法瀏覽器兼容庫(kù)

Hbuilder特別版使用說(shuō)明

打開(kāi)文件夾，找到Hbuilder的啟動(dòng)文件，然后郵件選擇發(fā)送到桌面快捷方式，這樣方便我們之后快速的啟動(dòng)。

點(diǎn)擊桌面的Hbuilder快捷方式，打開(kāi)我們的Hbuilder登錄郵箱進(jìn)入到Hbuilder的工作臺(tái)中并進(jìn)行一些基礎(chǔ)設(shè)置。

設(shè)置完成后，我們的Hbuilder就算是已經(jīng)安裝好了，記下來(lái)我們就開(kāi)始學(xué)習(xí)怎么使用它，首先我們新建一個(gè)web項(xiàng)目，之后命名，選擇存儲(chǔ)位置。

然后我們就可以打開(kāi)這個(gè)文件，開(kāi)始我們的代碼編寫(xiě)之旅了，而且Hbuilder編寫(xiě)代碼是由提示的，比如我們想創(chuàng)建一個(gè)塊元素div，那么我們輸入d后面就會(huì)出現(xiàn)相應(yīng)的提示，大大的加快了代碼的編寫(xiě)速度。

Hbuilder常用快捷鍵

1.文件(4)

新建 Ctrl + N

關(guān)閉 Ctrl + F4

全部關(guān)閉 Ctrl + Shift + F4

屬性 Alt + Enter

2.編輯(13)

激活代碼助手 Alt + /

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

開(kāi)啟關(guān)閉注釋整行 Ctrl + /

開(kāi)啟關(guān)閉注釋已選內(nèi)容 Ctrl + Shift + /

刪除當(dāng)前行 Ctrl + D

刪除當(dāng)前標(biāo)簽 Ctrl + Shift + T

刪除至行首 Shift + Backspace

刪除至行尾 Shift + del

合并下一行 Ctrl + Alt + J

整理代碼格式 Ctrl + Shift + F

向下移動(dòng)行 Ctrl + 向下

向上移動(dòng)行 Ctrl + 向上

選中當(dāng)前行 Ctrl + L

3.插入(3)

重復(fù)插入當(dāng)前行或選中區(qū)域 Ctrl + Shift + R

快速插入

(在html中) Shift + Enter

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

4.選擇(4)

向左選詞 Ctrl + Shift + 向左

向右選詞 Ctrl + Shift + 向右

選擇相同詞 Ctrl + Shift + A

選擇成對(duì)內(nèi)容 Ctrl + ‘[‘

5.跳轉(zhuǎn)(9)

上一個(gè)選項(xiàng)卡 Ctrl + Tab

前一詞 Ctrl + 向左

后一詞 Ctrl + 向右

轉(zhuǎn)到上一個(gè)文本輸入點(diǎn) Alt + 向上

轉(zhuǎn)到下一個(gè)文本輸入點(diǎn) Alt + 向下

行首 Home

行尾 End

頁(yè)首 Ctrl + Home

頁(yè)尾 Ctrl + End

6.查找(8)

搜索條 Ctrl + F

搜索框 Ctrl + H

查找文件 Ctrl + T

隱藏搜索條 ESC

聚焦到搜索條件框內(nèi) Ctrl + Alt + F

聚焦到替換輸入框內(nèi) Ctrl + Alt + E

在搜索條內(nèi)換行 Alt +Enter

HTML標(biāo)簽規(guī)范 Ctrl + Shift + H

7.運(yùn)行(1)

運(yùn)行 Ctrl + R

8.工具(1)

CSS/HTML語(yǔ)法校驗(yàn) Ctrl + Shift + V

9.視圖(6)

活動(dòng)視圖或編輯器最大化 Ctrl + M

顯示行號(hào)菜單 Ctrl + F10

激活邊看邊改視圖 Ctrl + P

激活開(kāi)發(fā)視圖 Ctrl + Shift + P

全部折疊 Ctrl + Alt + -

全部展開(kāi) Ctrl + Alt + +

Hbuilder實(shí)用技巧和常見(jiàn)問(wèn)題

Q:怎么實(shí)現(xiàn)代碼追蹤？

A:在編輯代碼時(shí)經(jīng)常會(huì)出現(xiàn)需要跳轉(zhuǎn)到引用文件或者變量定義的地方，HBuilder提供了一個(gè)非常好用的代碼追蹤功能，

只需要按住Alt+鼠標(biāo)左鍵即可實(shí)現(xiàn)追蹤。

Q:編輯器怎么實(shí)現(xiàn)分欄？

A:HBuilder編輯器分欄功能可以實(shí)現(xiàn)左右分欄和上下分欄以及組合分欄。

1、左右分欄實(shí)現(xiàn)：鼠標(biāo)點(diǎn)著編輯器選項(xiàng)卡往最右邊拖動(dòng) 到最小化按鈕部分 即可實(shí)現(xiàn)左右分欄

左右分欄實(shí)現(xiàn)效果：

2、上下分欄實(shí)現(xiàn)：鼠標(biāo)點(diǎn)著編輯器選項(xiàng)卡往最下邊拖動(dòng) 到左右滾動(dòng)條處 即可實(shí)現(xiàn)上下分欄

上下分欄實(shí)現(xiàn)效果：

3、組合分欄實(shí)現(xiàn)：組合分欄就是即有的文件向下拖動(dòng)，有的文件向右拖動(dòng)，下面給出一個(gè)效果圖，

感興趣的話您可以拖個(gè)試試：

Q:有沒(méi)有快速比較兩個(gè)文件差異的辦法？

A:比較兩個(gè)文檔的方法是，在項(xiàng)目管理器按ctrl選兩個(gè)文件，點(diǎn)右鍵，選比較對(duì)象

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

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

A:記快捷鍵，不如記快捷鍵語(yǔ)法。

Alt是轉(zhuǎn)到，Shift是轉(zhuǎn)移，Ctrl是操作。

比如Alt+括號(hào)、引號(hào)，即使轉(zhuǎn)到對(duì)于的符號(hào)。

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

Ctrl+D是刪除行，F(xiàn)2是重構(gòu)命名。

Q:為什么不能手機(jī)預(yù)覽？

A:WEB項(xiàng)目不可以手機(jī)預(yù)覽頁(yè)面。只有移動(dòng)APP才可以。

確定項(xiàng)目是移動(dòng)APP后,確保移動(dòng)設(shè)備插好數(shù)據(jù)線并連接到電腦。

如果是iOS設(shè)備,請(qǐng)確保電腦安裝有itunes,如果是Android,請(qǐng)確定手機(jī)驅(qū)動(dòng)已經(jīng)安裝。

此時(shí)在HBuilder下方的狀態(tài)欄也會(huì)提示手機(jī)已連接

然后點(diǎn)運(yùn)行,選擇對(duì)應(yīng)的設(shè)備即可。

如果你只是想預(yù)覽web項(xiàng)目，那么在菜單工具->選項(xiàng)->HBuilder->web服務(wù)器->內(nèi)建服務(wù)器里，

選擇一個(gè)內(nèi)網(wǎng)ip，比如192.xxx，然后手機(jī)通過(guò)wifi連入這臺(tái)機(jī)器，即可預(yù)覽。

Q:如何修改使用瀏覽器預(yù)覽時(shí),地址欄顯示的IP

A:依次點(diǎn)擊工具-選項(xiàng)-HBuilder-Web服務(wù)器-內(nèi)建服務(wù)器

可修改內(nèi)建服務(wù)器的IP地址為127.0.0.1或本機(jī)網(wǎng)卡IP

內(nèi)建服務(wù)器不可以運(yùn)行PHP

需要重啟HBuilder才生效

Q:真機(jī)聯(lián)調(diào)的Development圖標(biāo)如何去掉？

A:真機(jī)聯(lián)調(diào)僅是為了制作手機(jī)APP，調(diào)試完畢后,需要將資源打包制作成為APP。

如果是為了在手機(jī)瀏覽器上使用的WEB應(yīng)用，還是應(yīng)該使用手機(jī)瀏覽器來(lái)訪問(wèn)。HBuilder內(nèi)置的web

服務(wù)器地址配成192.168等內(nèi)網(wǎng)地址，手機(jī)wifi連入，即可訪問(wèn)。

更改HBuilder內(nèi)置的web服務(wù)器地址請(qǐng)點(diǎn)擊菜單工具-選項(xiàng)，展開(kāi)左邊的HBuilder-web服務(wù)器-內(nèi)建服

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

Q:沒(méi)有黑色主題嗎？

A:在菜單工具-視覺(jué)主題設(shè)置-高級(jí)設(shè)置里有各種主題，兼容eclipse的其他主題方案。

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

綠柔主題是認(rèn)真的研究了色彩心理學(xué)和生理學(xué)后制作的環(huán)保主題。

Q:如何調(diào)整編碼?

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

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

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

8、關(guān)于PHP

Q:PHP怎么運(yùn)行?

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

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

安裝好后，在HBuilder的工具-選項(xiàng)-web服務(wù)器中點(diǎn)新建外部web服務(wù)器，配置地址和參數(shù)，保存后重啟HBuilder。

然后點(diǎn)運(yùn)行即可。

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

A:PHP的語(yǔ)法高亮需要安裝PHP插件。

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

如果確定安裝了php插件，那么在工具-選項(xiàng)，搜索文件關(guān)聯(lián)，在里面配置php文件和PHP Editor的關(guān)聯(lián)。

也可以在項(xiàng)目管理器里對(duì)文件點(diǎn)右鍵，打開(kāi)方式，里面選PHP Editor。

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

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

右鍵點(diǎn)擊文件-打開(kāi)方式，可以看到所有編輯器。

很多不常用的文件后綴名其實(shí)都可以通過(guò)HTML編輯器打開(kāi)。

10、在Hbuilder中使用git

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

②右擊項(xiàng)目文件——Team——共享項(xiàng)目，項(xiàng)目里邊的文件就會(huì)自動(dòng)添加了一個(gè)倉(cāng)庫(kù)小圖標(biāo)：

③管理倉(cāng)庫(kù)文件時(shí)：右擊文件 team，然后進(jìn)行你需要的操作，commit、pull、push等