博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
table表单中的属性
阅读量:4573 次
发布时间:2019-06-08

本文共 2193 字,大约阅读时间需要 7 分钟。

表格属性 

    <table>标签里需要设置的属性     
border:表格的边框。比如,border=1,表示表格边框的粗细为1个像素, 
为0表示没有边框。 
cellspacing:单元格间距。当一个表格有多个单元格时,各单元格的距离就是cellspacing, 
表格只有一个单元格,这个单元格与表格上、下、左、右边边框的距离也是cellspacing。 
cellpadding:单元格衬距。指该单元格里的内容与cellspacing区域的距离, 
cellspacing为0,表示单元格里的内容与表格周边边框的距离。 
width:表格的宽度。width的取值还可以使用百分比,如widht="100%"。 
height:表格的高度,取值方法同width。 
bgcolor:表格的背景色。bgcolor=#ff0000或bgcolor=red。 
<td>单元格也可有此属性。 
background:表格的背景图。<td>也有此属性。 
bordercolor:表格的边框颜色,当border值不为0时此值有效。取值同bgcolor。 
bordercolorlight:亮边框颜色,当border值不为0时设置此值有效。 
亮边框指表格的左边和上边的边框。 
bordercolordark:暗边框颜色,当border值不为0时设置有效。 
暗边框指表格的右边和下边的边框。 
align:表格的对齐方式,值有left(左对齐)、center(居中)以及right(右对齐)。 
      列1 表格式样和代码      
本表格的属性设置: 
边框大小:border=1 
边框颜色:bordercolor=#808000 
背景色:bgcolor=#cc9968 
表格宽度:width=300 
单元格间距:cellspcing=8 
单元格衬距:cellpadding=4 
表格的对齐方式(居中):align=center 
注:其他属性未设置。 
            代码             
<TABLE borderColor=#808000 cellSpacing=8 cellPadding=4 width=300 align=center bgColor=#cc9968 border=1> 
<TBODY> 
<TR> 
<TD> 
<P>本表格的属性设置:</P> 
<P>边框大小:border=1 </P> 
<P>边框颜色:bordercolor=#808000 </P> 
<P>背景色:bgcolor=#cc9968 </P> 
<P>表格宽度:width=300 </P> 
<P>单元格间距:cellspcing=8 </P> 
<P>单元格衬距:cellpadding=4 </P> 
<P>表格的对齐方式(居中):align=center </P> 
<P>注:其他属性未设置。 </P></TD></TR></TBODY></TABLE> 

eg.

 

<html>
  <head>
  <style>
  table
  {
  width:740ox;
  height:211px;
  border:solid 1px #d9e4f2;
  margin-left:auto;
  margin-right:auto
  }
  td
  {
  font-family:宋体;
  font-size:14px;
  width:293px;
  height:34px;
  text-align:left;
  padding-left:10px;
  }
  th
  {
  font-family:宋体;
  font-size:14px;
  font-weight:normal;
  width:110px;
  height:34px;
  text-align:left;
  padding-left:10px;
  border:solid 1px #d9e4f2;
  background-image:url(images/bg2.png);
  }
  </style>
  </head>
  <body>
  <table border="1cellpadding="0cellspacing="0style="border-collapse:collapse">
  <tr>
  <th>职位分类</th>
  <td colspan="3">前端开发工程师</td>
  </tr>
  <tr>
  <th>职位分类</th>
  <td>上海黄浦</td>
  <th>工作性质</th>
  <td>全职</td>
  </tr>
  <tr>
  <th>工作地点</th>
  <td>3000-5000(元、月)</td>
  <th>福利待遇</th>
  <td>无/面谈</td>
  </tr>
  <tr>
  <th>工作经验</th>
  <td>一年以上</td>
  <th>年龄要求(岁)</th>
  <td>20-30</td>
  </tr>
  <tr>
  <th>学历要求</th>
  <td>大专(含以上)</td>
  <th>性别要求</th>
  <td>不限</td>
  </tr>
  <tr>
  <th>招聘人数</th>
  <td>5人</td>
  <th>隶属部门</th>
  <td>总部 研发部</td>
  </tr>
   
  </table>
  </body>
  </html>

转载于:https://www.cnblogs.com/dongsheng/archive/2013/01/15/2861951.html

你可能感兴趣的文章
Usenet:P2P下载的替代方法
查看>>
POJ 2155 Matrix (D区段树)
查看>>
我的小前端 (1)—— 安卓机和ios机的区别
查看>>
andorid简易定位
查看>>
前端基础标签
查看>>
PHP常见的加密算法
查看>>
react-navigation 简介
查看>>
源码编译安装php7
查看>>
参数化查询与sqlparameter类的使用
查看>>
拷贝,集合,函数,enumerate,内置函数
查看>>
2018-6-4-Python全栈开发day13-14-集合与函数
查看>>
Nginx与Tomcat集成
查看>>
Hadoop学习笔记: 安装配置Hadoop
查看>>
c/c++ 继承与多态 子类隐藏父类的同名非虚函数
查看>>
APP耗电量测试
查看>>
Elasticsearch & Kibana with Shield
查看>>
面向对象进阶
查看>>
子节点填充父元素除去一固定高度后的剩余高度
查看>>
[原]IOS 后台发送邮件
查看>>
(转)JAVA Calendar详解
查看>>