2015-09-22CSS：border、background、表格、超链接、overflow、fi

1、CSS的border属性

⑴定义和用法

border 简写属性在一个声明设置所有的边框属性。

可以按顺序设置如下属性：

border-width

border-style

border-color

如果不设置其中的某个值，也不会出问题，比如 border:solid #ff0000; 也是允许的。

值

描述

border-width

规定边框的宽度。

border-style

规定边框的样式。例如，solid、dashed、dotted、none。

border-color

规定边框的颜色。

      width:200px;      height:200px;      border:1px dashed red; 

　　

⑵分别设置border的上、下、左、右

      width:200px;      height:200px;      border-right:1px dashed red;      border-left:1px dashed red;      border-top:1px solid red;      border-bottom:1px dotted red; 

　　

2、CSS的background属性

⑴背景颜色

background-color:#0000FF; 

　　

⑵背景图片

background-image:url("image/clear.png"); 

　　

⑶背景图片重复

background-repeat:repeat;/*默认值*/ 

　　

background-repeat:repeat-x; 

　　

background-repeat:repeat-y; 

　　

background-repeat:no-repeat; 

　　

⑷背景图片位置

background-position:50px 100px; 

　　

⑸拉伸背景图片

      background-repeat:no-repeat;      background-size:cover; 

　　

⑹背景图片固定

body{      background-image:url("image/clear.png");      background-repeat:no-repeat;      background-attachment:fixed;} 

　　

3、表格样式

⑴表格的标题

      2004~2007年度收入       2004  2005  2006  2007        1234  2345  3456  4567    

　　

table{      caption-side:bottom;} 

　　

⑵表格的边框

table{      border:1px solid red;} 

　　

⑶边框重叠

th,td{      border:1px solid red;} 

　　

th,td{      border:1px solid red;}table{      border-collapse:collapse;} 

　　

⑷行的表头、列的表头

th scope="col"th scope="row" 

　　

示例代码：

        年度收入 2004 - 2007                                 2004             2005             2006             2007                           拨款             11,980             12,650             9,700             10,600                           捐款             4,780             4,989             6,700             6,590                           投资             8,000             8,100             8,760             8,490                           募捐             3,200             3,120             3,700             4,210                           销售             28,400             27,100             27,950             29,050                           杂费             2,100             1,900             1,300             1,760                           总计             58,460             57,859             58,110             60,700          

　　

4、超链接

⑴去掉超链接的下划线

a{      text-decoration:none;} 

　　

⑵效果

a:link{      color:red;/*未访问时的颜色*/} a:visited{      color:green;/*已经访问过的颜色*/} a:hover{      color:blue;/*鼠标悬停的颜色*/      cursor:pointer;} a:active{      color:orange;/*鼠标点击时的颜色*/} 

　　

5、CSS的 overflow 属性

所有主流浏览器都支持 overflow 属性。overflow 属性规定当内容溢出元素框时发生的事情。

值

描述

visible

默认值。内容不会被修剪，会呈现在元素框之外。

hidden

内容会被修剪，并且其余内容是不可见的。

scroll

内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。

auto

如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。

6、一个工具

FireFox浏览器的插件Firebug

查看更多关于2015-09-22CSS：border、background、表格、超链接、overflow、fi的详细内容...