zoukankan      html  css  js  c++  java
  • table表格

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>table</title>
        <link href="css.css" rel="stylesheet" />
        <style type="text/css">
            table {
            margin:0 auto
            }
            h4 {
            text-align:center
            }
        </style>
    </head>
    <body>
    <h4>横跨两列的单元格:</h4>
    <table border="1" cellspacing="10">
    <tr>
      <th>姓名</th>
      <th colspan="2">电话</th>
    </tr>
    <tr>
      <td>Bill Gates</td>
      <td>555 77 854</td>
      <td>555 77 855</td>
    </tr>
    </table>

    <h4>横跨两行的单元格:</h4>
    <table border="1" cellpadding="10">
    <tr>
      <th>姓名</th>
      <td>Bill Gates</td>
    </tr>
    <tr>
      <th rowspan="2">电话</th>
      <td>555 77 854</td>
    </tr>
    <tr>
      <td>555 77 855</td>
    </tr>
    </table>


    <h4>没有 cellpadding:</h4>
    <table border="1">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>

    <h4>带有 cellpadding:</h4>
    <table border="1" cellpadding="10">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>


    <h4>没有 cellspacing:</h4>
    <table border="1">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>

    <h4>带有 cellspacing:</h4>
    <table border="1"
    cellspacing="10">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>


       
    <h4>背景颜色:</h4>
    <table border="1"
    bgcolor="red">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>

    <h4>单元背景:</h4> 
    <table border="1">
    <tr>
      <td bgcolor="red">First</td>
      <td>Row</td>
    </tr>  
    <tr>
      <td
      bgcolor="green">
      Second</td>
      <td>Row</td>
    </tr>
    </table>


    <table width="400" border="1">
     <tr>
      <th align="left">消费项目....</th>
      <th align="right">一月</th>
      <th align="right">二月</th>
     </tr>
     <tr>
      <td align="left">衣服</td>
      <td align="right">$241.10</td>
      <td align="right">$50.20</td>
     </tr>
     <tr>
      <td align="left">化妆品</td>
      <td align="right">$30.00</td>
      <td align="right">$44.45</td>
     </tr>
     <tr>
      <td align="left">食物</td>
      <td align="right">$730.40</td>
      <td align="right">$650.00</td>
     </tr>
     <tr>
      <th align="left">总计</th>
      <th align="right">$1001.50</th>
      <th align="right">$744.65</th>
     </tr>
    </table>


    <h4>这个表格有一个标题,以及粗边框:</h4>
    <table border="6">
    <caption>我的标题</caption>
    <tr>
      <td>100</td>
      <td>200</td>
      <td>300</td>
    </tr>
    <tr>
      <td>400</td>
      <td>500</td>
      <td>600</td>
    </tr>
    </table>

    </body>
    </html>

  • 相关阅读:
    用colorWithPatternImage设置view背景色太占内存,替代方法
    快捷键
    数组里面放入随机数
    Android图像处理之Bitmap类
    android屏幕适配_
    最火的Android开源项目
    boost 编译
    QTextEdit更改单个段落/块的字体
    自定义QMenu样式
    Qimage QBuffer
  • 原文地址:https://www.cnblogs.com/xiaoleidiv/p/3229805.html
Copyright © 2011-2022 走看看