好看的css表格样式,css样式表有哪些效果
怎么设置漂亮的表格的样式 css
下面来个例子,你可以复制到你的编辑器里修改测试
创新互联建站主打移动网站、成都网站制作、成都做网站、外贸营销网站建设、网站改版、网络推广、网站维护、国际域名空间、等互联网信息服务,为各行业提供服务。在技术实力的保障下,我们为客户承诺稳定,放心的服务,根据网站的内容与功能再决定采用什么样的设计。最后,要实现符合网站需求的内容、功能与设计,我们还会规划稳定安全的技术方案做保障。
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
thInfo Header 1/ththInfo Header 2/ththInfo Header 3/th
/tr
tr
tdText 1A/tdtdText 1B/tdtdText 1C/td
/tr
tr
tdText 2A/tdtdText 2B/tdtdText 2C/td
/tr
/table
CSS(层叠样式表)级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
纯CSS设置表格样式
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title千声盒子/title
style type="text/css"
/*不要使用标签名作为类名*/
/*.table{text-align:center;width:100%;height:100%;border-width:thin;border-style:solid;border-color:#AA9FFF;border-collapse:separate;}*/
.tbClass {
text-align:center;
width:100%;height:100%;
/*首先对大表格加上左边 和 底边*/
/*我自作主张加上了底边框,可以删掉去*/
/*听说FF下不支持缩写,请你自己把下面的写法拆分出来*/
border-left:2px #AA9FFF solid; /* 左边框 */
border-bottom:2px #AA9FFF solid; /*底边框*/
}
.tbClass td {/*单元格的上边和右边*/
border-top:2px #AA9FFF solid;
border-right:2px #AA9FFF solid;
}
.tbClass td {/*测试用,为了看到效果,你可以把这个删掉去*/
/*width:100px; height:80px;*/
}
/*专门为“盒子那行写的类”*/
.boxCell td { height:101px; padding:0; margin:0}
/style
/head
body
table id="Box" name="Box" class="tbClass" cellspacing=0!--注意! 1:我把类名由table改成tbClass了, 2: cellspacing=0--
?php
for($i=1;$i=1000;$i++){
if($i%5==0){
echo "td$i/td";
echo "/tr
tr class=\"boxCell\"
td盒子/td
td盒子/td
td盒子/td
td盒子/td
td盒子/td
/tr
";/////注意! 这里使用了一个boxCell的CSS类,不会那么多冗余代码
echo "tr";
}else{
echo "td$i/td";
}
}
?
/table
/body
/html
//////最后说明;
1。如果乱码,或无显示,请注意你php文件的编码格式,或在浏览器下选择GBK32编码
2。这种专业问题,如果到Csdn 里发帖,十分钟之内就有人回答了
3。百度的BUG:回复后再修改,就不能保持代码的缩进了 -_-!即不能tab缩进,要换成4个空格
table好看的css样式
这个还行
style type="text/css"table.imagetable { font-family: verdana,arial,sans-serif; font-size:11px; color:#333333; border-width: 1px; border-color: #999999; border-collapse: collapse;
}table.imagetable th { background:#b5cfd2 url('cell-blue.jpg'); border-width: 1px; padding: 8px; border-style: solid; border-color: #999999;
}table.imagetable td { background:#dcddc0 url('cell-grey.jpg'); border-width: 1px; padding: 8px; border-style: solid; border-color: #999999;
}
/style
名称栏目:好看的css表格样式,css样式表有哪些效果
当前地址:http://scjbc.cn/article/dseiggp.html