zoukankan      html  css  js  c++  java
  • 表格基础

    <table>

    <tr>

    <td>1</td>

    <td>2</td>

    <td>3</td>

    </tr>

    <tr>

    <td>1</td>

    <td>2</td>

    <td>3</td>

    </tr>

    <tr>

    <td>1</td>

    <td>2</td>

    <td>3</td>

    </tr>

    </table>

    一、

    表格:table

    行:table row

    列:table data

    4*4表格 table>tr*4>td*4(按Tab键)

    二、

    table属性:borede 1px 设置表格边框

                    300px  height:300px(如果设置的宽高小于表格的内容,宽高按表格内容走;如果设置的宽高大于表格的内容,宽高按设置的大小走。)

                    水平居中align:left;center;right;

                    背景颜色bgcolor:pink;

                    边框颜色bordercolor:blue;

                    内边距cellpadding:10px;

                    外边距cellspacing:20px;

     tr属性:align:left;center;right; 当前行文本水平对齐

                valign:top;middle;bottom;当前行文本垂直对齐

     td属性:会影响整个表格的列

                height:会影响整个表格的行

                align:left;center;right; 设置当前列对齐方式

                valign:top;middle;bottom;设置当前行对齐方式

                bgcolor:设置当前单元格的背景颜色(自己个儿的背景色)

    三、

    不规则的表格使用

    colspan跨列——当一个4*4的表格,你想把第一行的第1列和第2列合并;

                     语法<table><tr>

                               <td colspan=“2”></td>

                               <td></td>

                               <td></td>

                               

                          </tr>

    rowspan跨行——当一个4*4的表格,你想把第四列的第2行和第3行和第4行合并;                 

                           <tr>

                               <td></td>

                               <td></td>

                               <td></td>

                               <td rowspan=“3”></td>

                          </tr>

                           <tr>

                               <td></td>

                               <td></td>

                               <td></td>

                              

                          </tr>

                              

                           <tr>

                               <td></td>

                               <td></td>

                               <td></td>

                          

                          </tr>

                  </table>

    四、

    行/列的标题th

    将td换成th(内容文字加粗,并居中)

    五、

    表格标题

    <caption></caption>如要设置表格标题,需紧跟在<table></table>后面,中间不能隔东西;

    六、

    行分组(可分区域管理类似页头、页中、页尾)

    表头行<thead></thead>

    表主体<tbody></tbody>

    表尾行<tfoot></tfoot>

    七、

    取色器写法——<span style="color:red">取色器</span> ——在浏览器中按F12-style-Add backgroundcolor-即可拾色;

  • 相关阅读:
    php
    php
    linux 网络管理基础 OSI ISO IOS的区别
    Linux 添加交换分区的步骤
    linux 命令
    linux命令
    linux 命令
    linux 命令
    Linux命令
    linux命令- 挂载命令 mount
  • 原文地址:https://www.cnblogs.com/zmxyl-1437/p/11607482.html
Copyright © 2011-2022 走看看