CSS教程

1、CSS 背景

· background-color 背景颜色。

· background-image 元素的背景图像.

· background-repeat 水平方向平铺 (repeat-x),

· background-attachment 背景图像是否固定或者随着页面的其余部分滚动

· background-position 属性改变图像在背景中的位置:

2、CSS Text文本格式

· 十六进制值 - 如"＃FF0000"

· 一个RGB值 - "RGB（255,0,0）"

· 颜色的名称 - 如"红"

文本的对齐方式

文本排列属性是用来设置文本的水平对齐方式。

文本可居中或对齐到左或右,两端对齐.

当text-align设置为"justify"，每一行被展开为宽度相等，左，右外边距是对齐

text-decoration属性主要是用来删除链接的下划线：

text-decoration:line-through 删除

text-decoration:underline 下划线

文本转换

文本转换属性是用来指定在一个文本中的大写和小写字母。

text-transform

CSS表格边框:

使用border属性。

border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开：

text-align属性设置水平对齐方式，像左，右，或中心：

表格填充

Padding属性

CSS 盒子模型

· Margin（外边距） - 清除边框区域。Margin没有背景颜色，它是完全透明

· Border（边框） - 边框周围的填充和内容。边框是受到盒子的背景颜色影响

· Padding（内边距） - 清除内容周围的区域。会受到框中填充的背景颜色影响

· Content（内容） - 盒子的内容，显示文本和图像

元素总宽度计算

例如总宽度300px

Width : 250px

Padding: 10px

Boder ：5px soid black；

Margin:10px

计算 250+20+10+20=300

则：总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

边框样式

边框样式属性指定要显示什么样的边界。

border-style属性用来定义边框的样式

border-style属性可以有1-4个值：

· border-style:dotted solid double dashed;

o 上边框是 dotted

o 右边框是 solid

o 底边框是 double

o 左边框是 dashed

· border-style:dotted solid double;

o 上边框是 dotted

o 左、右边框是 solid

o 底边框是 double

· border-style:dotted solid;

o 上、底边框是 dotted