网络基础编程第七章

第七章

 

7·1表格的概述

 

表格常用元素
      <table>:表格标记
         <tr>:行标记 
         <td>:列标记
         <th>:表头标记
    <caption>:表格标题

7·2 插入表格---<table>

          语法:<table>
                 <tr>
                   <td></td>
                 </tr>
               </table>
     说明:
           <table>插入表格
           <tr>插入一行
           <td>插入一列

7·2·1 设置基本表格结构
        
           <table>定义表结构
           <tr>定义行结构
           <td>定义列结构

7·2·2 设置表格标题---<caption>

该标记用于<table>标记和<tr>标记之间的任何位置

          语法:<table>
               <caption>插入表格标题</caption>
                 <tr>
                 </tr>
                 <tr>
                   <td></td>
                 </tr>
               </table>

7·2·3 设置表格表头---<th>

作用:制作表头将表格中的元素归类。

          语法:<table>            
                 <tr>
                  <th>..</th>
                 </tr>
                 <tr>
                   <td></td>
                 </tr>
               </table>

          说明:在HTML中,要将某一行作为表格文件的表头,只要将该行包含的列标               记<td>改为<th>即可。

7·2·4设置划分结构表格---<thead>、<tbody>和<tfoot>(双)

   指一个表格分成三个部分在网页上显示。

          语法:<thead></thead>---定义一组表头行  
               <tbody></tbody>---定义表格主体部分
               <tfoot></tfoot>---为表格添加一个标注(表注)

7·3 设置表格标记属性

7·3·1 设置表格的宽度和高度---width和height
7·3·2 设置表格的边框属性---border

表格边框属性:

   名称:border            说明:边框粗细
   名称:bordercolor       说明:边框颜色
   名称:bordercolorlight  说明:亮边框颜色
   名称:bordercolordark   说明:暗边框颜色

7·3·3 设置边框的样式---frame,rules
  
frame常见属性:
属性值:above        说明:显示上边框
属性值:border       说明:显示上下左右边框
属性值:below        说明:显示下边框
属性值:hsides       说明:显示上下边框
属性值:lhs          说明:显示左边框
属性值:rhs          说明:显示右边框
属性值:void         说明:不显示边框
属性值:vsides       说明:显示左右边框

rules常见属性:
属性值:all        说明:显示所有内部边框
属性值:groups     说明:显示介于行列边框
属性值:none       说明:不显示内部边框
属性值:cols       说明:仅显示列边框
属性值:rows       说明:仅显示行边框

7·3·4 设置表格的背景---bgcolor

7·4 设置表格行与单元格

<tr>主要用于设定表格某一行的属性
<td>标记的属性主要用于设置表格单元格的属性

7·4·1 调整行内容水平对齐---align

7·4·2 调整行内容垂直对齐---valign
        其值:   top---顶端对齐
                middle---剧中对齐
                bottom---底端对齐
                baseline---基线对齐

7·4·3 设置跨行(纵向合并)---rowspan
          语法:<table>
                  <tr>
                    <td rowspan="2"></td>
                    <td></td>
                  </tr>
               </table>    

7·4·4 设置跨列(横向合并)---colspan
          语法:<table>
                  <tr>
                    <td colspan="2">&nbsp;</td>
                    <td></td>
                  </tr>
                  <tr>
                    <td></td>
                  </tr>
               </table>  

7·4·5 设置单元格间距---cellspacing
          语法:<table cellspacing="">
                  <tr>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                  </tr>
               </table>    

7·4·6 设置单元格边距---cellpadding
          语法:<table cellpadding="0">
                  <tr>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td></td>
                  </tr>
               </table>    

7·5 表格嵌套
          语法:<table width=760 border=1>
                  <tr>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td>
                      <table width=100% border=1>
                        <tr>
                          <td>&nbsp;</td>
                          <td>&nbsp;</td>
                          <td>&nbsp;</td>
                        </tr>
                      </table>
                    </td>
                  </tr>
               </table>    

你可能感兴趣的:(职场,网页制作,休闲)