HBuilderX是款優(yōu)秀的國(guó)產(chǎn)HTML5的Web開(kāi)發(fā)工具，是編輯器和IDE的完美結(jié)合，支持HTML、CSS、JS、PHP的快速開(kāi)發(fā)，默認(rèn)包包含優(yōu)秀的字處理能力，創(chuàng)新眾多其他編輯器不具備的高效字處理模型，HBuilderX獨(dú)有的UniApp開(kāi)發(fā)插件、快應(yīng)用開(kāi)發(fā)插件、還可以幫助開(kāi)發(fā)者快速開(kāi)發(fā)手機(jī)App。通過(guò)插件擴(kuò)展，HX可變身為強(qiáng)大的IDE。一貫頂尖的代碼提示、轉(zhuǎn)到定義、運(yùn)行調(diào)試。

HBuilderX特色

1、輕巧

僅10M的綠色發(fā)行包

2、極速

HBuilderX不管是啟動(dòng)速度、大文檔打開(kāi)速度、編碼提示，都會(huì)極速響應(yīng)

3、清爽護(hù)眼

HBuilderX界面清爽簡(jiǎn)潔，綠柔主題經(jīng)過(guò)科學(xué)的腦疲勞測(cè)試，是最適合人眼長(zhǎng)期觀看的主題界面

4、無(wú)鼠標(biāo)操作

掌握HBuilderX的無(wú)鼠標(biāo)操作體系，成為高效極客，飛一般編碼

5、markdown優(yōu)先

HBuilderX是唯一一個(gè)新建文件默認(rèn)類型是md的編輯器。

除了頂尖的markdown編寫(xiě)體驗(yàn)、漂亮的著色外，HX的極速啟動(dòng)、多標(biāo)簽、熱退出、各種快捷鍵操作，都給了你充足的理由升級(jí)記事本工具。

HBuilderX使用教程

HBuilderX怎么運(yùn)行

1、打開(kāi)在本站下載好的HBuilderX軟件，打開(kāi)軟件后點(diǎn)擊軟件頂部的【文件】選項(xiàng)，在彈出的選擇中點(diǎn)擊【新建】，選您要新建的文件.JS，HTML，CSS等您可以自行選擇。

2、小編選擇的是HTML文件，點(diǎn)擊HTML文件選項(xiàng)，會(huì)彈出新建HTML文件窗口，選擇【含mui的HTML】。

3、一個(gè)HBuilderX文件就創(chuàng)建好了，輸入您要完成的HTML代碼就可以了。

4、輸入完成后將文件進(jìn)行保存，您可以使用Ctrl+s鍵保存文件，或者點(diǎn)擊如圖中紅框標(biāo)注出的位置也可保存文件。

5、保存完成后點(diǎn)擊HBuilderX軟件菜單欄的【運(yùn)行】選項(xiàng)，點(diǎn)擊【運(yùn)行到瀏覽器】選項(xiàng)，選擇您要運(yùn)行的瀏覽器就可以了。

6、然后在您選擇的瀏覽器中出現(xiàn)運(yùn)行的結(jié)果。

hbuilderx 如何調(diào)試

1、打開(kāi)hBuilderX找到上方的運(yùn)行按鈕，點(diǎn)擊進(jìn)行連接;通常情況下，是不會(huì)連接成功的，還需要進(jìn)行一些其他的設(shè)置，需要將hBuilderX上的工具。

2、連接成功的話就會(huì)出現(xiàn)連接頁(yè)面，可以看著頁(yè)面進(jìn)行更改，但是處理的時(shí)候會(huì)出現(xiàn)一些問(wèn)題，就是當(dāng)你做出更改的時(shí)候可能會(huì)沒(méi)有變化，這個(gè)時(shí)候你需要雙擊這個(gè)按鈕從新打開(kāi)進(jìn)行調(diào)試就可以了。

3、設(shè)置內(nèi)置web服務(wù)器的IP地址為自己電腦的地址，以及端口號(hào)，確保端口號(hào)不沖突。

4、在左邊寫(xiě)代碼，保存時(shí)右邊會(huì)自動(dòng)刷新頁(yè)面，非常方便調(diào)界面。對(duì)于less、sass等預(yù)編譯語(yǔ)言，在ctrl+s后自動(dòng)輸出css后，也會(huì)繼續(xù)激活瀏覽器的刷新。

5、代碼里的一個(gè)div點(diǎn)右鍵，選“高亮瀏覽器內(nèi)對(duì)應(yīng)元素”，就會(huì)看到右側(cè)瀏覽器里指定的元素高亮了。