HTML中怎样设置细线表格?

HTML中怎样设置细线表格?,第1张

<table border="1" cellspacing="0" >

<!--border=1设置包括标签table,tr,td的边框粗细,cellspacing合并标签tr,个td的空隙-->

<tr>

<td>1-1</td>

<td>1-2</td>

</tr>

<tr>

<td>2-1</td>

<td>2-2</td>

</tr>

</table>

1、事先定义

<table border="2">

<table style="border:2px solid red">

<table style="border-bottom:2px solid red">

2、通过javascript动态设置

<table id="tab1">

<script language="javascript" type="text/javascript">

var obj

obj=document.getElementById("tab1")

obj.style.border="2px solid red"

</script>

html:

<table cellspacing="0">

<tbody>

<tr>

<td>姓名</td>

<td></td>

<td>性别</td>

<td></td>

<td>年龄</td>

<td></td>

<td>婚否</td>

<td></td>

<td>籍贯</td>

<td></td>

</tr>

<tr>

<td>住址</td>

<td colspan="3"></td>

<td>所属单位</td>

<td colspan="5"></td>

</tr>

</tbody>

</table>

css:

tbody,tr,td{border:1px solid #000}

td{width:70px}

td:not(:first-child){

border-left:none

}

tr:not(:first-child) td{

border-top:none

}

大概的样子,其他的你慢慢弄


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6229917.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-18
下一篇 2023-03-18

发表评论

登录后才能评论

评论列表(0条)

保存