移动端工程师学习javascrip的笔记和归纳,内容非常基础。
文字大小 font-size
- font-size属性必须有单位,否则不生效,PC端网页常用单位 px
- 谷歌浏览器文字默认大小:16px
字体粗细 font-weight
- font-weight:400 不加粗
- font-weight:700 加粗
字体倾斜 font-style
- 清除文字默认的倾斜效果
- normal:不倾斜
- italic:倾斜
行高 line-height
- 数字 + px
- 数字(当前标签font-height的倍数)
行高-垂直居中技巧:行高属性值 = 盒子高度属性值
字体 font-family
- font-family: 楷体
复合属性 font
- 属性的
简写
方式,一个属性对应多个值的写法,各个属性之间空格隔开 - 是否倾斜 字体粗细
字号/行高 字体(必须按顺序书写)
- 字号和字体值必须书写,否则font属性不生效
- 使用场景:设置网页公共样式
div {
/* 文字倾斜 字体加粗 字体大小30px 行高2倍 楷体*/
font: italic 700 30px/2 楷体
}
文本锁紧 text-indent
- 数字 + px
- 数字 + em(推荐:1em = 当前标签的字号大小,推荐)
文本对齐方式 text-align
- left:左对齐 默认
- center:居中
- right:右对齐
text-align本质是控制内容的对齐方式,不是标签样式,属性要设置给内容的父级
图片居中,给父级标签设置居中
装饰线 text-decoration
属性值 | 效果 |
---|---|
none | 无 |
underline | 下划线 |
line-through | 删除线 |
overline | 上划线 |