h5標簽基礎 table表格標簽


一、表格的定義:用於有規范的顯示數據。

  

二、基本組成:

     行<tr>/列<td>/表頭<caption>/表標題<th>

        

    eg:

      <table>

          <caption><h1>學生信息表</h1></caption> <!---表頭--->

          <tr> <!----行-->

            <th>姓名</th>

            <th>年齡</th>  <!----標題-->

          </tr>

          <tr> <!----行-->

            <td>張大勇</td>  <!----列-->

            
            <td>22歲</td>  <!----列-->

          </tr>

      </table>

三、table包含的屬性

    寬:width  高:hight 背景色:bgcorlor

    單元格與單元格之間的距離:cellspacing=數值,默認是2可設置

           指單元格里的內容占據的地方 cellpadding=數值   可設置

    邊框線:border=數值

      eg:

        細線表格的制作

            

        分析:table標簽有背景色(bgcolor)屬性,tr也有,而細線可以通過單元格與單元格之間的距離設置后,給用戶體現為細線,從而不使用border這個屬性

        代碼:

  <table cellspacing="3" bgcolor="green" width="500" height="200">

<tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr><tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr><tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr><tr bgcolor="white">
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

</table>

 

四、橫向合並、縱向合並單元格

  橫向:colspan="數值"

   縱向合並:rowspan="數值"

  eg:制作一個課程表

    

  代碼:

      

      <table bgcolor="green" cellspacing="2" width="600" height="300" >
          <caption><h1>課程表</h1></caption> <!---表頭-------->

          <tr bgcolor="white"><!----行-->

    <th colspan="2"></th>
    <th>星期一</th>
    <th>星期二</th>
    <th>星期三</th>
    <th>星期四</th>
    <th>星期五</th>

 </tr>
 <tr bgcolor="white"><!----行-->
    <td >上午</td>
    <td>1</td>
    <td>數學</td>
    <td>語文</td>
    <td>英語</td>
    <td>物理</td>
    <td>歷史</td>
 </tr>
 <tr bgcolor="white"><!----行-->
    <td >下午</td>
    <td>2</td>
    <td>數學</td>
    <td>語文</td>
    <td>英語</td>
    <td>物理</td>
    <td>歷史</td>
</tr>

</table>

 

    

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM