本节内容
- 课时61 文字相关属性(掌握)
- 课时62 字体属性补充(掌握)
- 课时63 文字属性的简写(掌握)
- 课时64 文本属性(掌握)
- 课时65 颜色控制属性上(理解)
- 课时66 颜色控制属性下(理解)
文字相关属性
规定文字样式的属性
font-style: inherit;
快捷键：fs
- normal:正常样式，默认值,快捷键：fsn
- italic:倾斜
规定文字粗细的属性
font-weight:bolder;
快捷键：fw
- 单词取值
- bold 加粗
- bolder 加粗还要粗 快捷键：fwbr
- lighter 细线，默认值
- 数值取值
- 100到900之间，整百数字
- 100 细线
- 900 最粗
- 一般用的比较少
规定文字大小的属性
font-size: 30px;
快捷键：fz
- 单位的像素，px，即pixel
- 通过它设置大小，一定要写px单位
- 快速编写：fz30
规定文字字体的属性
font-family: 'console'
快捷键：ff
- 若是中文字体名称，要用单或者双引号括起来
- 设置的字体要是用户电脑内有的字体
若字体用户电脑不存在怎么办
- 不存在的话，默认是宋体显示
- ff是支持备选字体的，若首选字体不存在，就选备选队列中的字体，只需要将这些字体用逗号分来罗列出来即可
font-family: '主选字体','备选1','备选2','备选3';
如何单独设置英文或者中文字体
- 但凡是中文字体，里面都包含英文
- 但凡是英文字体，里面都不包含中文
font-family: Arial, '微软雅黑';
这样，英文字体就是第一个字体，因为中文字体Arial不提供，就是用备选的微软雅黑字体
补充
企业开发中，最常用的字体：
- 中文：宋体，黑体，微软雅黑
- 英文：Times New Roman，Arial
还有就是，并不是名称就是英文名称就是英文字体，中文字体可是也有英文名字的，这都看能不能处理英文来辨别
- 宋体 SimSun
- 黑体 SimHei
- 微软雅黑 Microsoft YaHei
注释：
/* */
文字属性的简写
缩写格式：
font:style weight size family
p{
font:italic bold 40px "SimHei"
}
注意点
- 在缩写格式中，有的属性值可以省略，如style，weight。且style和weight是可以交换位置的
- 在缩写格式中，有的属性值是不可以省略的，size，family不能省略。且size和family是不能随便乱放的，size一定要在family之前，size和family必须写在所有属性之后
文本属性
- 文本装饰属性
text-decoration: underline;
快捷键：td ，默认none
- underline 下划线，快捷键tdu
- line-through 删除线，快捷键tdl
- overline 上划线，快捷键：tdo
- none 清除所有的装饰，啥都没有，对a标签很有用，可以去超链接下划线
- 文本水平对齐属性
text-align: center
快捷键：ta
- center 居中 tac
- left 左 tal
- right 右 tar
- 文本缩进属性
text-indent: 2em;
快捷键：ti
- 2em 缩进两个文字，em是字体个数单位，单位可以是任何单位，比如px，快捷键：ti2e
颜色控制属性
在css中如何用color修改颜色
color: red;
color: rgb(red, green, blue);
color: rgba(red, green, blue, alpha);
color: #FF0000;
color: #F00;
其赋值方式有以下5类：
- 英文单词赋值
- 一般情况下，常见颜色都有其英文单词，但并非所有的颜色英文单词都能表达，一般用于做调试
- RGB赋值
- 三原色
- 格式rgb(255,0,0)
- 那么这个格式中的数字就是用来设置各光源元件的亮度
- 取值从0到255，越大越亮
- 灰色咋调节？当rgb同数值，并且数值越大越白，越小越黑
- 例如rgb（10,10,10）
- RGBA赋值
- 他是css3推出的
- 其中A是透明度的意思，取值从0到1,1就是不透明，0就是透明
- 十六进制赋值
- 每两位就对应一个颜色，6位数字对应rgb的三个颜色
- 16进制转换10进制公公式
- 16进制的第一位*16 + 十六进制的第二位 = 十进制（本公式仅适用于颜色转换）
- 15 == 1*16 + 5 = 21
- 00 == 0(十进制)
- FF == 255(十进制)
- 十六进制缩写赋值
- 只要十六进制颜色，每两位的值都是一样的，就可以简写。
- 例如： #FFEE00 就可以简写成 #FE0。
- 注意点：
- 若当前颜色对应的两位数字不一样，就不能简写；
- 若两位相同的数字不是属于同一个颜色的，也不能简写。
网友评论