zoukankan      html  css  js  c++  java
  • html-----005

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Language" content="zh-cn" />
    <title>第一个</title>
    </head>
    <body>
    <h4>这个表格没有边框:</h4>
    <!--border="0",或者是不写border的时候才是没有边框-->
    <table border="0">
    <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>
    

      

    <body>
    <table border="1">
    <tr>
      <td>
       <p>这是一个段落。</p>
       <p>这是另一个段落。</p>
      </td>
      <td>这个单元包含一个表格:
       <table border="1">
       <tr>
         <td>A</td>
         <td>B</td>
       </tr>
       <tr>
         <td>C</td>
         <td>D</td>
       </tr>
       </table>
      </td>
    </tr>
    <tr>
      <td>这个单元包含一个列表:
       <ul>
        <li>苹果</li>
        <li>香蕉</li>
        <li>菠萝</li>
       </ul>
      </td>
      <td>HELLO</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="20">
    <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="15">
    <tr>
      <td>First</td>
      <td>Row</td>
    </tr>   
    <tr>
      <td>Second</td>
      <td>Row</td>
    </tr>
    </table>
    

      

    <body>
    
    <h4>表头:</h4>
    <table border="1" width="500">
    <tr align="center" bgcolor="#0000FF">
      <th>姓名</th>
      <th>电话</th>
      <th>电话</th>
    </tr>
    <tr align="left" bgcolor="#FFFF00">
      <td>Bill Gates</td>
      <td>555 77 854</td>
      <td>555 77 855</td>
    </tr>
    </table>
    
    <h4>垂直的表头:</h4>
    <table border="1" width="500">
    <tr>
      <th align="left" bgcolor="#FF0000">姓名</th>
      <td bgcolor="#00FF00">Bill Gates</td>
    </tr>
    <tr>
      <th>电话</th>
      <td>555 77 854</td>
    </tr>
    <tr>
      <th>电话</th>
      <td>555 77 855</td>
    </tr>
    </table>
    <br />
    <br />
    <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>
    View Code

    <body>
    
    <h4>横跨两列的单元格:</h4>
    <table border="1">
    <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">
    <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>
    </body>
    View Code

    <body>
    <p><b>注释:</b>frame 属性无法在 Internet Explorer 中正确地显示。</p>
    <p>Table with frame="box":</p>
    <table frame="box">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>
    
    <p>Table with frame="above":</p>
    <table frame="above">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>
    
    <p>Table with frame="below":</p>
    <table frame="below">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>
    
    <p>Table with frame="hsides":</p>
    <table frame="hsides">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>
    
    <p>Table with frame="vsides":</p>
    <table frame="vsides">
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>
    </body>
    View Code

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Language" content="zh-cn" />
    <style type="text/css">
    thead {color:green}
    tbody {color:blue;}
    tfoot {color:red}
    </style>
    <title>第一个</title>
    </head>
    <body>
    <table border="1" width="290">
      <thead>
        <tr>
          <th>月份</th>
          <th>工资</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>January</td>
          <td>$100</td>
        </tr>
        <tr>
          <td>February</td>
          <td>$80</td>
        </tr>
      </tbody>
      <tfoot>
        <tr>
          <td>总结</td>
          <td>$180</td>
        </tr>
      </tfoot>
    </table>
    
    </body>
    </html>
    

      

  • 相关阅读:
    20145310《信息安全系统设计基础》第二周学习总结
    20145310《信息安全系统设计基础》第一周学习总结
    20145310 第0周《信息安全系统设计基础》学习总结
    课程总结
    20145310《Java程序设计》第5次实验报告
    20145310 《Java程序设计》第10周学习总结
    20145310 《Java程序设计》第9周学习总结
    20145310《Java程序设计》第4次实验报告
    20145310《Java程序设计》第3次实验报告
    git的安装以及遇到的问题
  • 原文地址:https://www.cnblogs.com/9999w/p/4377836.html
Copyright © 2011-2022 走看看