CSS基本整理2
CSS本整理<2>
@[基本实例|css基本样式]
CSS背景
使用
background-color
属性为元素设置背景色
p {background-color: gray;}
使用
background-image
属性为元素设置背景图片
body {background-image: url(/i/eg_bg_04.gif);}
利用
background-position
属性改变图像在背景中的位置
body
{
background-image:url('/i/eg_bg_03.gif');
background-repeat:no-repeat;
background-position:center;
}
可以使用一些关键字:top、bottom、left、right 和 center
CSS文本
改变文本的颜色、字符间距,对齐文本,装饰文本,对文本进行缩进
| 属性 | 描述
| :-- | :---:
|color| 设置文本颜色
|direction| 设置文本方向。
|line-height| 设置行高。
|letter-spacing |设置字符间距。
|text-align| 对齐元素中的文本。
|text-decoration| 向文本添加修饰。
|text-indent |缩进元素中文本的首行。
|text-transform |控制元素中的字母。
|white-space| 设置元素中空白的处理方式。
|word-spacing| 设置字间距。
CSS字体
使用
font-family
属性 定义文本的字体系列
font-style
属性最常用于规定斜体文本
- normal - 文本正常显示
- italic - 文本斜体显示
- oblique - 文本倾斜显示
font-weight
属性设置文本的粗细
font-size
属性设置文本的大小
CSS链接
链接的四种状态:
- a:link - 普通的、未被访问的链接
- a:visited - 用户已访问的链接
- a:hover - 鼠标指针位于链接的上方
- a:active - 链接被点击的时刻
注意:当为链接的不同状态设置样式时,请按照以下次序规则:
a:hover 必须位于 a:link 和 a:visited 之后
a:active 必须位于 a:hover 之后
CSS表格
属性 | 描述 |
---|---|
list-style | 简写属性。用于把所有用于列表的属性设置于一个声明中。 |
list-style-image | 将图象设置为列表项标志。 |
list-style-position | 设置列表中列表项标志的位置。 |
list-style-type | 设置列表项标志的类型 |
对各标志使用一个图像
ul li {list-style-image : url(xxx.gif)}
CSS表格
border
设置表格边框
table, th, td
{
border: 1px solid blue;
}
CSS轮廓
属性 | 描述 |
---|---|
outline | 在一个声明中设置所有的轮廓属性。 |
outline-color | 设置轮廓的颜色。 |
outline-style | 设置轮廓的样式。 |
outline-width | 设置轮廓的宽度 |