hbuilderx怎么设置中文界面 hbuilder设置字体间距代码?

[更新]
·
·
分类:互联网
4808 阅读

hbuilderx怎么设置中文界面

hbuilder设置字体间距代码?

hbuilder设置字体间距代码?

第一步、打开hbuilder开发工具,新建一个html文件,在这个html页面,需要创建两个ltdivgt,同时设置一些文字,第一个div作为对照组,第二个div需要添加class类名为big,方便后面设置行高:
步骤二、在ltheadgt标签里创建一个ltstylegt标签,然后设置使big类的line-height属性,设置属性值为5像素该属性就是用来设置行间距的:
步骤三、按下crtl S保存页面,在软件右侧的浏览器,可看到页面上big类的div标签里的行间距变大了

hbuilder,怎么用于设置圆角边框的属性?

使用工具:HBuilder.exe代码:代码含义: 标签用于搜集用户信息的输入框。
typetext 规定 input 元素是文本类型。value“输入框圆角” 规定 input 元素的值。border-radius: 6px; 使元素有6个像素的圆角边框。代码原理:border-radius 规定元素圆角的大小。

hbuilder制表快捷方式?

回答如下:
HBuilder常用的快捷键:
Alt [ 匹配括号
Alt ↓跳转到下一个可编辑区
Ctrl Alt j 合并下一行
Ctrl Alt ←选择助手
Ctrl 回车 换行
Ctrl Shift 回车 向上换行
Ctrl d 删除一行
Ctrl Shift R 复制上一行
创建HTML结构: h 8 (敲h激活代码块列表,按8选择第8个项目,即HTML代码块,或者敲h t Enter)
中途换行: #39Ctrl Enter#39
设置charset: m e 6 Enter
引用外部js: s 2 Enter #39Ctrl Enter#39
创建js区块: s Enter
创建函数: f u n 3 (或者 f u n n Enter)
为函数命名:W h o i s E
跳转到函数末尾: End #39Alt [#39 ↓ #39Ctrl Enter#39 (Alt [是跳转到匹配括号的意思)
创建style节点: s t Enter ↓ #39Ctrl Enter#39
引用外部css: l Enter Enter
跳转到下一个可编辑区: #39Alt ↓#39
创建img标签: i m Enter Enter #39Ctrl Enter#39
插入换行符: #39Shift Enter#39 Enter
创建div并设id和class: d i Enter d 1 → Space c Enter Enter (这里提示的class列表是在test.css里定义的)
转到class的定义处:#39Ctrl Alt D#39 (按Alt点击鼠标也可以)
关闭标签页:#39Ctrl w#39 (切换标签页则可以用Ctrl e)
添加自定义属性data-test并赋值1: → Space d 7 t e s t Tab 1
合并下行:#39Ctrl Alt j#39 #39Ctrl Enter#39
创建超链接并设id: a Enter Enter → Space i Enter a 1
使用选择助手选中#d1:#39Ctrl Alt ←#39 #39Ctrl Alt ←#39 #39Ctrl Alt ←#39 (如果快捷键冲突,可使用Alt S U,或者鼠标双击引号)
重新修改链接指向新创建的a1: BackSpace #39Alt /#39 Enter #39Ctrl Enter#39
创建ul: u Enter
折叠代码:#39Ctrl Alt -#39
向上插入空行:#39Ctrl Shift Enter#39 Tab (一般Ctrl 某字母的快捷键,变成Ctrl Shift 相同字母,大多代表相反意义)
没有代码块时,使用emmet语法创建标签:n a v Tab (如果不知道emmet技术,请搜索学习,前端必学)
使用shift转码输入空格:#39Shift Space#39 (如果与输入法快捷键冲突,也可输入amp n 2)
创建按钮:#39Ctrl Enter#39 i n Enter Enter Tab Tab w h o Space i s Space e →
添加点击事件: Space o n c k Enter w h o Enter → (onck是模糊匹配,不用输入完整单词也会模糊匹配,除代码块外所有语法提示都支持模糊匹配)
使用转到定义到js函数:#39Ctrl Alt D#39 ↓
------以下为js部分
定义一个变量e: v a r Space e Enter
为e赋值:e Space Space d o Enter . g 6 #34 Enter (可提示样式列表)
使用回车或Tab跳转光标到绿色竖线(若没有绿色竖线请使用End到行尾):Enter Enter
为e赋值2:e Space Space d o Enter . g 8 #34 d 8 Enter Enter (可提示标签列表)
为e赋值3(这个代码块很常用):e Space Space $ (或者dg) Enter 2 Enter Enter (可提示id列表,注意选择d1)
为e设置algin属性: e . s e 2 #34 a l Enter → , #34 c Enter Enter Enter
设置自定义属性:e . s e 2 #34 d Enter → , #34 2 Enter Enter
提示字体列表: e . s t Enter . f o 2 #34 Enter Enter Enter
提示图片列表: e . s t Enter . b 7 #34 h b Enter Enter Enter
还能这么写css: e . s t Enter . c s 2 #34 b 7 h b Enter → Enter
写switch对e判断:s w 2 e . s t Enter . d i s Enter Tab
case处提示display的值域:#34 - w e Enter
跳转到switch结尾(有绿色竖线):Enter Enter
写if代码块:i f f Enter (或者使用i f 2)
为if添加条件判断属性里的样式:e . g e t a t Enter #34 c Enter Enter ! #34 Enter ↓
设置e的样式:e . c l 2 (此处也可以用c l n Enter) #34 Enter Enter ↓ Enter
js里可以提示html: e . i n n Enter #34 lt f o Enter Space c o Enter Enter Enter Enter
e赋值改为超链接:e Space Space $ Enter Enter Enter Enter
给a1加链接地址:e . h r Enter #34 Enter Enter Enter
给a1加target:e . t 5 #34 Enter Enter Enter
e赋值改为image对象:e Space Space n e w Space i m 6 Enter Enter
为img增加图片: e . s r Enter #34 Enter Enter Enter
e赋值改为indexedDB对象:e Space Space w i Enter . i Enter Space | | Space w i Enter . i n d e x e d 5 Space | | Space w i Enter . i n d e x e d 3 Space | | Space w i Enter . i n d e x e d 2 Enter
确认e可被浏览器识别:i f f Enter (也可以使用i f 2) t y 4 e Enter ↓
执行indexdb的方法:e . o p Enter #34 t e s t Enter ↓ Enter
------以下为删除又添加上外部css引用
定义head变量:v a r Space h e a d Space Space d o Enter . g 8 #34 h e Enter Enter [ 0 → Enter
with里也可以提示: w i t h h (或者w i t 2) Enter h Enter ↓
获取head的最后一个子节点:v a r Space l Space Space l e c Enter Enter (with里的head可直接识别子对象)
去掉该子节点:r e m 6 l → ↓ Enter (head的lastElementChild就是外部引用的css)
动态生成一个css文件引用:e Space Space d c Enter l 5 Enter Enter
添加属性:e . r 3 #34 s t y Enter Enter Enter
设置type: e . t y Enter #34 c Enter Enter Enter
设置href:e . h r Enter #34 . c Enter Enter Enter
将e加入head中:h Enter . a p Enter e Enter Enter Enter
------演示重构,即重命名变量
用代码块定义一个变量s:v a r s Enter Tab e Space i s Space #39Ctrl Enter#39
判断e的属性:i f e(或i f 3) Enter e . g 2 #34 d Enter Enter n u 2 ↓
为s赋值:s s e . o u Enter #39Alt ↓#39
为s赋值:s s #34 u n k n o w → ↓ Enter
将s打印出来:a l Enter s
选择s并转到定义:#39Shift ←#39 #39Ctrl Alt D#39(按Alt点击鼠标也可以)
重构s的命名为ss:#39Ctrl F2#39 Enter s s Enter Enter (弹出对话框可预览重构结果)
跳转到函数末尾:#39Alt ↓#39 #39Alt ↓#39 Enter
添加一个启动事件: a d Enter #34 d o m l o Enter → , f u n a Enter (此处也可以是f u 6) ↓
提示自定义函数的jsdoc: f i n i Enter 1
------css部分
跳转到CSS:#39Alt ↓#39
给body加样式:b o Enter { Enter
emmet方式增加textalign:t c Tab Enter
模糊匹配增加user-select:u s e r s 4 5
写下一个样式:↓ Enter
为input增加样式:i n Enter [ t y Enter Enter → { Enter
使用代码块设置宽度:w 9 9 0 ↓ Enter
为ul加样式:u l { d n Enter #39Ctrl Enter#39
ID也可以提示:# 2 { Enter
提示字体列表:f f Enter Enter Enter
回车自动补行尾分号:Enter
增加background-image:b i Enter h b Enter
大功告成,保存并运行起来看看:#39Ctrl s#39 #39Ctrl r#39
如果你屏幕够宽,也可以点击右上角视图切换,换到边改边看视图Ctrl P,左边保存右边自动刷新。