zoukankan      html  css  js  c++  java
  • html 表格重要属性说明以及使用

    <table> 标签常用属性说明:

    border:表格边框宽度。

    以百分比或者像素指定表格的宽度。

    height:以百分比或者像素指定表格的高度。

    cellspacing:表格中相邻单元格的间距以及单元格外边框与表格边沿之间的间距,一般由css实现。

    cellpadding:单元格的边沿和它的内容的间距,一般由css实现。

    <caption>标签:表示表格的标题

    <tbody>标签:表格主体

    <thead>标签:表格表头

    <tfoot>标签:表格表尾

    <!DOCTYPE html PUBLIC "-//w3c//dtd HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content - Type" content="text/html; charset = UTF-8">
    <title>表格的使用</title>
    </head>
    <body>
    <table border="5" align="center">
      <caption>学生信息表</caption>
      <thead>
         <tr>
    	    <th>学号</th>
    		<th>姓名</th>
    		<th>性别</th>
    	 </tr>
      </thead>
      <tfoot>
         <tr>
    	    <td colspan="3" align="center">
    		这里是表尾
    		</td>
    	 </tr>
      </tfoot>
      <tbody>
         <tr>
    	    <td>0001</td>
    		<td>王明明</td>
    		<td>男</td>
    	 </tr>	 
         <tr>
    	    <td>0002</td>
    		<td>李梅</td>
    		<td>女</td>
    	 </tr>	 
         <tr>
    	    <td>0003</td>
    		<td>张晓丽</td>
    		<td>女</td>
    	 </tr>
      </tbody>
      </table>
    </body>
    </html>

    <td> <th>标签两个重要属性

    colspan:指当前单元格在水平方向跨越的单元格数;

    rowspan:指当前单元格在垂直方向上跨越的单元格数;

    两个属性的值为整数。

    应用:

    <html>
    <head>
    <title>
    cellspacing cellpadding colspan rowspan 属性使用 
    </title>
    </head>
    <body>
    <table border="5" align="center" cellspacing="40" cellpadding ="50">
    <caption>
    学生信息
    </caption>
    <tr>
    <td>
    学号
    </td>
    <td>
    姓名
    </td>
    <td>
    成绩
    </td>
    </tr>
    <tr>
    <td>
    1711421113
    </td>
    <td>
    高春辉
    </td>
    <td>
    100
    </td>
    </tr>
    <tr>
    <td colspan="3" align="center">表尾</td>
    </tr>
    </table>
    </body>
    </html>
  • 相关阅读:
    Audacious 1.3.0
    medit-多平台的 GTK 文本编辑器
    PIDA:基于 Gtk 的 Python IDE
    Xfce 4.4.0 for Ubuntu Edgy Eft
    Lemonrip-DVD 提取对象
    Tomboy 0.5.5
    网管经验谈:成功网管必备素质硬件篇
    再学 GDI+[35]: TGPPen 虚线画笔位移 SetDashOffset
    再学 GDI+[33]: TGPPen 画笔的几何变换 SetTransform
    再学 GDI+[37]: TGPPen TGPCustomLineCap、SetCustomStartCap、SetCustomEndCap
  • 原文地址:https://www.cnblogs.com/gaochunhui/p/11053912.html
Copyright © 2011-2022 走看看