设置表格所有行的样式css,怎么设置表格有多少行
怎么对表格应用CSS样式
方法一直接写页面上:
table style="css写这里"
对于td和tr同样加上style可直接写css(如td style="color:#F00")
方法二(推荐)
table class="table1"
然后在css文件定义table1
.table1{}
对于.table1 里的tr的css可以这样写 .table1 tr{}
同理,td可以这样 .table1 td{}
方法三
table id="table1"
然后在css文件定义table1
.table1{}
对于#table1 里的tr的css可以这样写 #table1 tr{}
同理,td可以这样 #table1 td{}
怎么主义表格CSS样式?
比如你要给某个表格加样式,在table里这样写:
table class="样式名"
如果要给表格某行加样式,在tr里这样写:
tr class="样式名"
如果只要给某个单元格加样式,在td里这样写:
td class="样式名"
在td里设定样式的话,该单元格里的文字自动应用样式,在tr里设定样式的话,该行所有单元格里的文字自动应用样式,在table里设定样式的话,该表格里所有单元格里的文字都会自动应用样式。
怎么设置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(标准通用标记语言的一个子集)等文件样式的计算机语言。
html设置表格所有行样式
可以使用css对行元素tr设置样式。
对tr设置样式,在没有限定的情况下,会对所有表格的行元素设置样式。
纯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个空格