Hbuilder快速代码技巧和常用快捷键

本文介绍HBuilder的实用快捷键及代码片段功能,包括快速生成HTML标签、属性和文本内容的方法,以及常见操作如删除、复制、移动等的快捷方式,提升前端开发效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.在body内输入div.abc按下tab键

效果:<divclass="abc"></div>

2.在body内输入div#abc按下tab键

效果:<div id="abc"></div>

3.在body内输入ul>li{小花}*3按下tab键

效果:<ul>

                 <li>小花</li>

                 <li>小花</li>

                 <li>小花</li>

         </ul>

4.在body内输入div>a[href='#']{小花}*3按下tab键

效果:<div>

                 <ahref="#">小花</a>

                 <ahref="#">小花</a>

                 <ahref="#">小花</a>

        </div>

5.在body内输入select>option{$}*5按下tab键

效果:<select name="" id="">

                 <optionvalue="">1</option>

                 <optionvalue="">2</option>

                 <optionvalue="">3</option>

                 <optionvalue="">4</option>

                 <optionvalue="">5</option>

          </select>   

6.在body内输入select>option[value='花香']{$}*5>a[href='#']{小花}按下tab键

效果:<select name="" id="">

                 <option value="花香">1<a href="#">小花</a></option>

                 <option value="花香">2<a href="#">小花</a></option>

                 <option value="花香">3<a href="#">小花</a></option>

                 <option value="花香">4<a href="#">小花</a></option>

                 <option value="花香">5<a href="#">小花</a></option>

        </select>      

总结一下:属性值用[ ]填充,文本内容用{ }填充,看完上面大概就明白了,谢谢。

HBuilder的常用快捷键

Ctrl + d                   删除整行内容
Ctrl + Shift +R       复制当前行到下一行
Ctrl + Shift +D      重新编辑
Ctrl + 方向键          当前行整行内容上移或下移
Alt + ↓                    跳转到下一个可编辑区
Ctrl + Alt + j          与下一行合并
Ctrl + Alt + ←        选择助手
Shift + 回车            生成换行符
Ctrl + 回车              向下插入空行
Ctrl + Shift + 回车  向上插入空行
Ctrl + Shift +F        格式化代码
Shift + 空格            全角/半角输入
Alt + [                     匹配括号
--------------------- 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值