hbuilder官方版是DCloud推出的一款支持HTML5的Web開發(fā)IDE。hbuilder官方版通過完整的語法提示和代碼輸入法、代碼塊等，大幅提升HTML、js、css的開發(fā)效率。同時，它還包括最全面的語法庫和瀏覽器兼容性數(shù)據(jù)。

相關(guān)推薦

相關(guān)軟件	版本說明	下載地址
eclipse	全新一代產(chǎn)品	查看
DreamWeaver	中文版	查看
motrix	中文版	查看
TextEdit	提高編輯速度	查看
JetBrains WebStorm	GNU編譯器套件	查看

基本簡介

HBuilder是DCloud（數(shù)字天堂）推出的一款支持HTML5的Web開發(fā)IDE。HBuilder的編寫用到了Java、C、Web和Ruby。HBuilder本身主體是由Java編寫。

目前主流前端開發(fā)工具有Sublime為代表的文本編輯器，以及Webstorm、Brackets、Dreamweaver、vs等IDE。但說道為HTML5設(shè)計或做了特殊優(yōu)化的，只有HBuilder、Webstorm和Brackets。

代碼塊介紹

      代碼塊激活字符原則1：

      連續(xù)單詞的首字母。比如：dg激活document.getElementById("");vari激活var i=0;dn激活display: none;

      代碼塊激活字符原則2：

      整段HTML一般使用tag的名稱。比如script、style，通常，敲最多4個字母即可匹配到需要的代碼塊，不需要完整錄入，如sc回車、st回車，即可完成script、style標簽的輸入。

      代碼塊激活字符原則3：

      同一個tag，有多個代碼塊輸出，則在最后加后綴。比如 meta 輸出 但 metau 則輸出 ，metag同理。

      代碼塊激活字符原則4：

      如果原始語法超過4個字符，針對常用語法，則第一個單詞的激活符使用縮寫。比如input button，縮寫為inbutton，同理intext是輸入框。

      代碼塊激活字符原則5：

      js的關(guān)鍵字代碼塊，是在關(guān)鍵字最后加一個重復字母。比如if直接敲會提示if關(guān)鍵字，但iff回車，則出現(xiàn)if代碼塊。類似的有forr、withh等。由于funtion字母較長，為加快輸入速度，取fun縮寫，比如funn，輸出function代碼塊，而funa和func，分別輸出匿名函數(shù)和閉包。

常見問題

1、HBuilder的快捷鍵怎么查看？

打開幫助----快捷鍵列表進行查看即可。

2、HBuilder的自定義怎么設(shè)置？

按下Alt鍵，移動鼠標到樣式或變量的引用處，會出現(xiàn)了可點擊的下劃線，點下去吧，這就是轉(zhuǎn)到自定義。

3、如何新建模板組？

點擊菜單----文件----HTML文件，點擊“自定義模板組”，將常用的若干文件壓縮為zip保存到該目錄，新建HTML文件時，模板組列表會多出以該zip文件的文件名命名的模板組，以該模板組新建HTML文件，HBuilder會自動生成zip里的文件（含內(nèi)容）。

更新日志

      新增了語言服務uni-app x支持css語法校驗和uvue標簽語法校驗。

      修復了語言服務uts語法校驗中泛型定義時使用內(nèi)部類誤報錯的Bug。

      修復了特殊值域string和string類型的變量相互賦值時誤報錯的Bug。

      修復了uni-app x平臺校驗錯誤提示時平臺錯誤順序和設(shè)置平臺時的順序不一致的Bug。

      修復了windows切換免打擾模式F11快捷鍵在默認快捷鍵方案下不生效的Bug。

功能介紹

      強大的語法提示

      開發(fā)者可以準確、高效的編寫HTML5代碼。HBuilder的語法提示比很多國外IDE還要好，而且還全免費。

      最快的開發(fā)工具

      代碼輸入法的創(chuàng)新、代碼塊的優(yōu)化、emmet的集成、快捷鍵語法設(shè)計、無鼠標操作。

      環(huán)保健康的主題設(shè)計

      設(shè)計了綠柔主題以保護開發(fā)者的視力健康。

      App開發(fā)及部署

      移動App開發(fā)也是HBuilder的優(yōu)勢，Run in device真機調(diào)試、打包發(fā)行這些功能并非普通的HTML4開發(fā)工具會涉及的。

FAQ

什么叫滾動條信息點?

當代碼中有重要的標記出現(xiàn)時，會生成滾動條信息點，在滾動條右側(cè)出現(xiàn)顏色各異的點。點擊這些點或使用跳轉(zhuǎn)到下一個信息點功能，可以快速到達這些代碼處。如下標記會生成信息點：書簽、任務、錯誤提示。

怎么實現(xiàn)代碼追蹤?

在編輯代碼時經(jīng)常會出現(xiàn)需要跳轉(zhuǎn)到引用文件或者變量定義的地方，HBuilder提供了一個非常好用的代碼追蹤功能，只需要按住Ctrl+鼠標左鍵即可實現(xiàn)追蹤。

輸入small不提示，語法庫是不是不全?

代碼塊是否提示，取決于是否設(shè)置了這個代碼塊，代碼塊是可自定義的。默認沒有預置small代碼塊，你也可以在代碼塊彈出界面點右下角的編輯圖標，進行代碼塊的補充修改。另外可以使用emmet(ZenCoding)語法，這個沒有提示，但敲完small，按tab，就會自動生成標簽。emmet是一種前端公開技術(shù)，網(wǎng)上教程很多。

為什么有時候我輸入代碼塊的名稱，卻沒有出現(xiàn)想要的代碼塊?

代碼塊的顯示名稱和激活字符是不同的，查看激活字符請在激活代碼助手后選擇代碼塊，看右邊信息欄的詳情。

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

1、左右分欄實現(xiàn)：鼠標點著編輯器選項卡往最右邊拖動即可實現(xiàn)左右分欄

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

2、上下分欄實現(xiàn)：鼠標點著編輯器選項卡往最下邊拖動即可實現(xiàn)上下分欄

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

3、組合分欄實現(xiàn)：組合分欄就是即有的文件向下拖動，有的文件向右拖動，下面給出一個效果圖，感興趣的話您可以拖個試試：

安裝步驟

      在本站下載最新版的HBuilder安裝包，雙擊.exe打開，進入安裝步驟，按照提示安裝即可。