css 样式

css背景

 

1背景

 

p {background-color: 颜色;}    //背景颜色

   

 

p {background-color: 颜色; padding: 20px;}     //背景颜色，增加内边距  

 

body {background-image: url(/i/eg_bg_04.gif);}    //背景图片的设置 

  

 2 文本

 

p {text-indent: 5em;}     //段落缩进

 

 

p {text-indent: -5em; padding-left: 5em;} //悬挂缩进 ,设置边距

p {text-align: center}  //居中

p{text-align: left} //左对齐

 

p {text-align: right}  //右对齐

 

 

3 字体

 

body {font-family: sans-serif;}      //设置一种字体，sans-serif是一种字体。
<span style="font-size: 1em;">可以查询css字体系列。</span> 

 

字体风格

 

p.normal {font-style:normal;} //文本正常显示
p.italic {font-style:italic;} //文本斜体显示
p.oblique {font-style:oblique;} //文本倾斜显示

 

4 链接

 

a:link {color:#FF0000;}          //未被访问的链接   
a:visited {color:#00FF00;}     //已被访问的链接  
a:hover {color:#FF00FF;}      //鼠标指针移动到链接上  
a:active {color:#0000FF;}     // 正在被点击的链接 

 

 

5 列表

在无序列表中

 

ul {list-style-type : square}    在一个无序列表中，列表项的标志是各列表旁的圆点。
你可以用square类型把标志设置成你想要的格式。 

 

  有序列表中

 

uo {list-style-type :decimal}     有序列表，标志可能是数字或字母，
然后用decimal把标志设置成自己想要的格式。  

 

 6 表格

设置是否把表格边框合并为单一的边框

 

table
  {
  border-collapse:collapse;
  }

分隔单元格边框的距离

 

 

table
  {
  border-collapse:separate;
  border-spacing:10px 50px;
  }

  表格标题的位置

 

 

caption
  {
  caption-side:bottom;
  }
//top	默认值。把表格标题定位在表格之上。
//bottom	把表格标题定位在表格之下。
//inherit	规定应该从父元素继承 caption-side 属性的值。

 是否显示表格中的单元格

table
  {
  border-collapse:separate;
  empty-cells:hide;
  }
//隐藏表格中空单元格上的边框和背景
//show	在空单元格周围绘制边框。
//inherit 从父元素empty-cells属性的值