手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >table高级应用把表格进行到底(必看)
table高级应用把表格进行到底(必看)
摘要:1.表格的分隔线可以隐藏可以隐藏横向的分隔线可以隐藏纵向的分隔线可以隐藏横向和纵向的分隔线2.表格的边框不断在闪以下方法可以令表格的边框不断...

1.表格的分隔线可以隐藏

<tableborderrules=colscellspacing=0align=left>可以隐藏横向的分隔线

<tableborderrules=rowscellspacing=0align=right>可以隐藏纵向的分隔线

<tableborderrules=nonecellspacing=0align=center>可以隐藏横向和纵向的分隔线

2.表格的边框不断在闪

以下方法可以令表格的边框不断在闪,很实用的

在BODY区加上

<tableborder="0"width="280"id="myexample"

style="border:5pxsolidyellow">

<tr>

<td>加入任意的物件.加入任意的物件.

<br>加入任意的物件.加入任意的物件.

<br>加入任意的物件.加入任意的物件.</td>

</tr>

</table>

<scriptlanguage="JavaScript1.2">

<>

</script>

3.表格分行下载

这个对表哥内容很大比较实用

在需要分行下载处加上<tbody>

比如:

<table>

<tbody>

<tr>

<td>flsdjfsdjfkdsjf</td>

</tr>

<tr>

<td>skdjfsdjfksd</td>

</tr>

</tbody>

<tbody>

<tr>

<td>flsdjfsdjfkdsjf</td>

</tr>

<tr>

<td>skdjfsdjfksd</td>

</tr>

</tbody>

</table>

4.几种样式不同的表格

<tableborder="1"width="220"style="position:absolute;left:

11;top:11"height="26">

<tr>

<tdwidth="100%">普通表格</td>

</tr>

</table>

5.正立方表格

<tableborder="1"width="220"bordercolorlight="#eeeeee"

bordercolordark="#000000"style="position:absolute;left:10;top:

49"height="26">

<tr>

<tdwidth="100%">正立方表格</td>

</tr>

</table>

6.细表格

<tableborder="0"frame=vsideswidth="219"

bgcolor="#000000"cellspacing="1"cellpadding="0"

height="22"style="position:absolute;left:11;top:86">

<trbgcolor="#FFFFFF">

<tdwidth="100%"height="2">细表格</td>

</tr>

</table>

7.立体表格

<tableborder="1"width="220"bordercolorlight="#ffffff"

bordercolordark="#ffffff"style="position:absolute;left:10;top:

112"height="34">

<tr>

<tdwidth="100%"bgcolor="#B7B7B7"

bordercolorlight="#000000"bordercolordark="#eeeeee">立体表格</td>

</tr>

</table>

8.无名表格

<tablewidth="220"align="center"style="position:absolute;

left:246;top:12"height="51">

<tr>

<td><fieldsetstyle="width:220"align="center">

<legend>无名表格</legend><palign="right"></fieldset>

<br>

</td>

</tr>

</table>

9.表中表效果Ⅱ

<tablewidth="220"align="center"style="position:

absolute;left:245;top:89"height="110">

<tr>

<tdheight="75"><fieldsetstyle="width:220"

align="center"><legend>表中表效果Ⅱ</legend><table

frame="hsides"border="1"

bordercolorlight="#000000"bordercolordark="#ffffff"

width="100%"cellspacing="1"cellpadding="0"height="78">

<trbgcolor="#ffffff">

<tdwidth="100%"height="76"></fieldset></td>

</tr>

</table>

10.表中表效果Ⅰ

<tablewidth="220"align="center"style="position:absolute;

left:10;top:120"height="138"cellspacing="1"

cellpadding="0">

<tr>

<tdheight="126"><fieldsetstyle="width:220;color:#B7B7B7;

border-style:groove"align="center"><legendstyle="color:

#FFFFFF;border:1solid#808080"><fontcolor="#000000">表中表效果Ⅰ</font>

</legend><palign="right"></fieldset>

</td>

</tr>

</table>

11.表格中边框的显示

只显示上边框<tableframe=above>

只显示下边框<tableframe=below>

只显示左、右边框<tableframe=vsides>

只显示上、下边框<tableframe=hsides>

只显示左边框<tableframe=lhs>

只显示右边框<tableframe=rhs>

不显示任何边框<tableframe=void>

【table高级应用把表格进行到底(必看)】相关文章:

使用CSS代码的空格实现中文对齐的方法

div使用margin:0px auto不居中的原因分析及解决

DIV下图片自适应解决方法

网页图片延迟加载技术

CSS3之边框多颜色Border-color属性使用

div怎么分左右两半?

纯CSS实现鼠标悬停提示的方法

用纯CSS代码创建日历图标

CSS table 单行布局示例代码

Iframe高度自适应代码

精品推荐
分类导航