共计 3394 个字符，预计需要花费 9 分钟才能阅读完成。
#CSS 的网页排版不仅可以控制文本的大小、颜色、对齐方式、字体，还可以控制行高、首行缩进、字母间距和字符间距等 #
一、常见声明（设置字体样式）
1、字体类型
| 属性 | 说明 |
| font-family | 设置字体的类型 |
| font-weight | 设置字体的粗细 |
| font-size | 设置字体的大小 |
| font-style | 设置字体的倾斜 |
①前言
- 字体两个类型的作用：传递语义功能、美学效应
- 字体大小：font-size：绝对尺寸 | 相对尺寸
- 字体粗细：font-weight：bold（粗体）| number（默认字体）| normal（比默认字小）| lighter（比默认字体大）| 100 – 900（400 相当于关键字 normal，700 相当于 bold）
- 字体倾斜：font-style：normal（正常）| italic（斜体）| oblique（倾斜体）
②字体样式的运用：
Document
测试字体属性
运行代码后如下
2、设置文本样式
| 属性 | 说明 |
| text- align | 设置文本的水平对齐方式 |
| line- height | 设置行高 |
| text- decoration | 设置文本修饰效果 |
| text-indent | 设置段落的首行缩进 |
| first-letter | 设置首字下沉 |
| text-overflow | 设置文本的截断 |
| color | 设置文本的颜色 |
| backgroune-color | 设置文本的背景颜色 |
①前言
- 文本样式的设置可以改变文字本身的效果。
- 通常使用 font 前缀和 text 前缀来区分两类不同性质的属性。
- 文字水平对齐方式：text- align：left | right | center | justify (两端对齐)
- 行高：line – height : length（长度值）| normal（默认行高）
- 文本的修饰：text-decoration:underline(下划线) | | blink（）闪烁 || overline（上划线）|| line-through（贯穿线）| none（无装饰）
- 段行首行缩进：text-indent：length（为百分比数字或有浮点数字、单位标识符组成的长度值）
②文本样式的运用：
Document
测试字体属性
运行代码后如下
二、图片属性
| 属性 | 说明 |
| width / height | 设置图像的缩放 |
| border | 设置图像边框样式 |
| opacity | 设置图像的不透明度 |
1、前言
- 图片样式包含了图片缩放和图片边框，图片既
元素。
元素在页面中的分格样式仍然用盒子模型设计。
- opacity 取值范围 0.0~1 透明度从大到小
2、图片样式的运用
图片属性
![]()
运行代码后如下
三、背景属性
| 属性 | 说明 |
| background-image | 设置背景图像 |
| background-repeat | 设置背景图像重复方式 |
| background-position | 设置背景图像定位 |
| background-attachment | 设置背景图像固定 |
| background-size | 设置背景图像大小 |
1、前言
2、背景属性的使用
背景属性
代码运行后如下：
四、表格属性
| 属性 | 说明 |
| border-collapse | 设置表格的行和单元格地边是合并在一起还是按照标准地 HTML 样式分开 |
| border-spacing | 设置当表格边框独立时，行和单元格地边框在横向和纵向上地间距 |
| empty-cells | 设置当表格的单元格无内容时，是否显示该单元格的边框 |
|
background-color |
设置表格背景颜色 |
| width / height | 设置表格的大小 |
|
vertical-align |
设置单元格内文本垂直对齐位置 |
|
text-align |
设置单元格内文本水平对齐位置 |
1、前言
- CSS 表格属性常用来改善表格的外观。
- border-collapse：separate（默认值，边框分开，不合并）| collapse（边框合并）
- border-spacing：length
- empty-cells：hide | show
2、表格属性的运用：
表格属性
代码运行后如下
五、表单属性
1、前言
- CSS 中的表格元素可以美化表单，其中包含了常用的文本域、单选钮、复选框、下拉菜单和美化菜单。
- 表格元素为
2、表单属性的运用：
表单属性
代码运行后如下
原文地址: CSS 的常见声明！
正文完
