CSS3笔记之第一天

通过展示实例来初步学习CSS3

1.背景

设置背景色：background-color:#b0c4de;

设置背景图片：background-image:url('paper.gif');

设置背景图片重复策略：background-repeat：repeat-x;(no-repeat),repeat-y

设置背景图片位置：background-position:right top;(left bottom)

设置背景的全部属性：background:#ffffff url('img_tree.png') no-repeat right top;

颜色 图片 重复 位置

2.文本

设置文本颜色：color ：red；

设置文本对齐：text -align：center （right，left，justify）

设置文本样式：text-decoration:none(underline)

控制文本字母：text-transform:uppercase

缩进文本 ：text-indent:2px;

字符之间的距离：letter-spacing:2px

行间距：line-height

文本方向：direction：rtl

文本垂直对齐：vertical-align

3.CSS的字体

设置字体：font-family

设置大小：font-size---排px,em,%

字体样式：font-style

字体的粗细：font-weight

设置全部：font:15px arial,sans-serif;

size ，family，style

4.CSS链接

a:link {color:#FF0000 text-decoration; background-color;}      /* 未访问链接*/
a:visited {color:#00FF00;}  /* 已访问链接 */
a:hover {color:#FF00FF;}  /* 鼠标移动到链接上 */
a:active {color:#0000FF;}  /* 鼠标点击时 */

注意： a:hover 必须在 a:link 和 a:visited 之后，需要严格按顺序才能看到效果。

注意： a:active 必须在 a:hover 之后。

5.列表

list-style-image:url('sqpurple.gif');

list-style-type

list-style-type:none

6.表格

border-collapse:collapse;//表格边框重叠

padding

margiin

设置边框：border：1px solid gray;

选择器：

类选择器.className{}

id选择器：#idName

待续.........