css---学习之路（三个常用标签，一些css常用属性）

常用的三个标签：

div：

div标签是块级标签，独占一行，通常用来定义一个盒子，方便处理，是css和html中最常用的标签

span

在某一段文本中突出显示某几个字，以粗体、红色、大字号显示，通常使用span标签。

pre

使用改标签可以将自己在书写工具中的信息原样输出。

css的常用属性

字体样式：

font-family

字体类型(宋体，微软雅黑<默认>)

font-size

字体大小 （默认16px）
单位：
px 像素
em （父容器字体大小em）
rem （根容器字体大小rem）

font-style 字体风格

一般用作字体倾斜，删除线

font-weight

设置字体粗细。

font 设置字体样式 （大小，类型必须有）

 p span{font:oblique bold 12px "楷体";}

字体属性的顺序：字体风格→字体粗细→字体大小→字体类型

文本样式

color 字体颜色

通常可以使用以下方式来规定字体颜色：
单词 red
16进制 #000 黑 #eee 灰 #fff 白
rgb 红 绿 蓝 0~255
rgba 红 绿 蓝 透明度 0~255 0~1

text-align 文本居中

right center left（默认）

text-indent 首行缩进

line-height 设置行高

一般行高和容器高度一致

text-decoration 文本装饰（主要用于 删除线 与 去除下划线）

none（去除下划线） line-through（删除线）

vertical-align 垂直对齐 （图片和文字）

一般用在img图片上 middle（中间） top（顶端） bottom（下部）

文本阴影

text-shadow : color  x-offset  y-offset  blur-radius;

超链接伪类

书写格式：

标签名:伪类名{声明;}

a:hover {
	color:#B46210;
	text-decoration:underline;
}

最常用的是a:hover属性，示例:

列表样式（修改原有的列表样式）

list-style-type:

示例：

背景样式

background-color（设置背景颜色）:

设置背景颜色

background-image（设置背景图片）:

background-image:url(图片路径);

background-repeat（设置图片重复方式）：

repeat：

沿水平和垂直两个方向平铺

no-repeat：

不平铺，即只显示一次

repeat-x：

只沿水平方向平铺

repeat-y：

只沿垂直方向平铺

background-position（图片定位）

background（背景简写）

background:#C00 url(../image/arrow-down.gif) 205px 10px no-repeat;

顺序：背景颜色 背景图像 背景定位 背景不重复显示

background-size

线性渐变

颜色沿着一条直线过渡：从左到右、从右到左、从上到下等

		/*上下渐变*/
	background: linear-gradient(blue,skyblue);
	
	/*中间到两边渐变*/
	background: radial-gradient(blue,skyblue);

上下渐变

中间到两边：