css表格样式怎么实现?

html-css014

css表格样式怎么实现?,第1张

table{

border-collapse: collapse //相邻边被合并

background-color: #cccccc//设置表格背景色

border-top: 1px solid #000000 //设置表格上边框颜色

border-left: 1px solid #000000 //设置表格左边框颜色

border-right: 1px solid #000000 //设置表格右边框颜色

border-bottom: 1px solid #000000 //设置表格下边框颜色

}

td {

border-right: 1px solid #000000 //设置td颜色

border-bottom: 1px solid #000000 //

}

表格制作练习可以到实战帮。

下面来个例子,你可以复制到你的编辑器里修改测试

<style type="text/css">

table.gridtable {}{

    font-family: verdana,arial,sans-serif

    font-size:11px

    color:#333333

    border-width: 1px

    border-color: #666666

    border-collapse: collapse

}

table.gridtable th {}{

    border-width: 1px

    padding: 8px

    border-style: solid

    border-color: #666666

    background-color: #dedede

}

table.gridtable td {}{

    border-width: 1px

    padding: 8px

    border-style: solid

    border-color: #666666

    background-color: #ffffff

}

</style>

<!-- Table goes in the document BODY -->

<table class="gridtable">

<tr>

    <th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>

</tr>

<tr>

    <td>Text 1A</td><td>Text 1B</td><td>Text 1C</td>

</tr>

<tr>

    <td>Text 2A</td><td>Text 2B</td><td>Text 2C</td>

</tr>

</table>

CSS(层叠样式表)级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。