CSS零基础学习笔记(三)

CSS属性：

1、文本与字体属性

2、列表属性

3、浮动属性

4、背景属性

5、盒子模型

6、定位属性

一、字体属性：

1、font-size----字体的大小

2、font-family----字体的类型

3、font-style----字体的风格font-style:italic斜体字体样式

4、font-weight----字体的粗细

二、文本属性：

1、color----设置文本颜色

2、line-height----设置行高line-height:24px

3、text-align----设置文本的对齐方式leftrightcenter

4、text-decoration----向文本添加修饰(overline--上划线underline--下划线line-through--删除线)

三、列表属性：

1、list-style-type----表示设置列表标志的类型

2、list-style-image----表示将图像设置为列表项标志

3、list-style-position----表示设置列表项标志的位置

list-style-type:

1、disc:缺省值，黑圆点

2、circle:空心圆点

3、square:小黑方块

4、none:无列表项标志

list-style-image:

list-style-image:url(../image/doc.gif);

list-style-position

1、outside----项目标记在文本以外，环绕文本不根据标记对齐

2、inside----项目标记在文本以内，环绕文本根据标记对齐

list-style

list-style:circleinsideurl(../image/doc.gif);

顺序为：1、list-style-type2、list-style-position3、list-style-image

四、浮动属性：

1、float：元素向哪个方向浮动(nonerightleft)

2、clear：设置元素的哪一侧不允许有浮动元素(noneleftrightboth)

五、背景属性：

1、background-color----表示背景颜色(transparent----透明的背景颜色)

2、background-image----表示背景图像

3、background-repeat----表示背景的重复方式

(repeat在水平和垂直方向上重复

repeat-x在水平方向上重复

repeat-y在垂直方向上重复

no-repeat不重复)

4、background-position----表示图像的起始位置

1、使用百分比，共有两个值，一个是在水平方向，一个是在垂直方向

2、使用top、left、center、right、bottom

3、使用像素，共有两个值，一个是在水平方向，一个是在垂直方向

六、盒子模型

1、border----边框

2、padding----填充

3、margin----边界

4、content----内容

一个盒子模型的实际宽度=内容+border+padding+margin

border:

border-topborder-leftborder-rightborder-bottom

三个属性：colorwidthstyle

一起设置时顺序为：上右下左