靈活的快捷鍵使得編程過程手不離鍵盤

靈活的快捷鍵使得編程過程手不離鍵盤

效果如下圖

• 新建html基本模板后,當前光標處于title標簽內(nèi),此時我們給HTML設(shè)置title:hellohbuilder,完成后使用Ctrl+回車在當前的下一行插入空行,并將光標移動到下一行

• 我們在此處使用sc代碼塊生成一個script塊來編寫js代碼(輸入sc,回車)如下圖

• 使用funn代碼塊編寫一個JS方法helloworld(輸入funn,回車)如下圖

• 此時生成的方法的方法名是選中狀態(tài),我們只需要直接輸入新的方法名helloworld即可,如下圖

• 上圖中的綠色豎線，是代碼塊中指定的下一個編輯位置,敲擊回車光標會直接跳轉(zhuǎn)至豎線位置

• 此時按向下、向下,Ctrl+回車,輸入style回車,生成css代碼區(qū)域

• 定義一個Css類classA：輸入. c l a s s A { 回車,f o n t 回車 回車 回車

• 然后按alt+下,alt+下跳轉(zhuǎn)至下一個編輯區(qū)域

• 依次輸入< d i v 也可輸入<dv回車、<iv回車,語法助手可以通過模糊匹配獲知想要生成的標簽)如下圖

• 如上圖所示,代碼助手左側(cè)包含數(shù)字，可以使用這些數(shù)字選擇對應(yīng)的條目,右側(cè)包含瀏覽器兼容性數(shù)據(jù)及示例

• 輸入i 回車 d 1,右箭頭,空格,c 回車 回車

• 鼠標在div標簽的class屬性classA上懸浮,按下Alt和左鍵,點擊后可跳轉(zhuǎn)至classA定義處

• Ctrl+回車

• div也可以通過代碼塊生成如輸入divc回車回車回車,輸入helloworld如下圖

• 向下,回車