知识结构

1. 字体属性

【web】css基础---5-字体样式
font-famliy字体属性
定义元素内的文字以什么字体显示
语法:font-famliy:[字体1],[字体2],....
说明

  • 含空格字体名和中文,用英文引号(")括起来
  • 多个字体,用英文逗号","隔开
  • 引号嵌套,外使用双引号,内使用单引号

【web】css基础---5-字体样式

【web】css基础---5-字体样式
【web】css基础---5-字体样式
其它字体集做了解就行
2. 字体大小
font-size字体大小
定义元素内的文字大小
语法:
font-size : 绝对单位/相对单位

  1. 绝对单位

【web】css基础---5-字体样式
2. 相对单位
【web】css基础---5-字体样式
【web】css基础---5-字体样式

3. 字体颜色
【web】css基础---5-字体样式

4.字体粗细
【web】css基础---5-字体样式
【web】css基础---5-字体样式
5.字体样式font-style
【web】css基础---5-字体样式

2. 字体对齐方式

【web】css基础---5-字体样式
块级元素和内联元素
div就是一个典型的块级元素

  • 所谓块级元素就是会独占一行,无论他的内容由多少,都会独占一行
  • 如 p , h1~h6 ,span
  • div标签没有任何意义,就是一个纯粹的块元素
  • div主要是用来页面布局的

span标签是一个典型的内联元素(行内元素)
所谓行内元素就是只是占据自身大小,不会占用一行
常见的内联元素

  • a , img .iframe,span
  • span没有任何语义,span专门用来选中文本/文字,然后为文字设置样式

块元素主要用来页面布局,内联元素用来选中文字设置样式

a 元素可以包含任意元素,除了它本身

3. vertical-align属性

【web】css基础---5-字体样式
【web】css基础---5-字体样式
【web】css基础---5-字体样式
单行文字或者元素垂直居中,只需要把line-height设置为父级元素高度就可以

4. line-height属性

【web】css基础---5-字体样式

5. 文字样式和其它样式

【web】css基础---5-字体样式
text-decoration示例
【web】css基础---5-字体样式

6. css文本样式应用

相关文章:

  • 2021-06-29
  • 2022-01-03
  • 2021-07-24
  • 2021-07-08
  • 2021-10-10
  • 2021-12-23
  • 2022-12-23
猜你喜欢
  • 2021-05-29
  • 2021-12-02
  • 2021-11-18
  • 2021-04-25
  • 2021-12-12
相关资源
相似解决方案