HTML:表格
1.表格三标签:
(1)<table> 表格
(2)<tr>  行
(3)<td>  单元格
2.表格的基本语法和结构
<table>
 <tr>
    <td>   </td>
 <tr>
    <td>   </td>
 </tr>
</table>
3.带表头的表格
<table>
 <tr>
  <th>……</th>     <!-表格头,内容居中、加粗显示-->
 </tr>
 <tr>
  <td>……</td>
 </tr>
</table>
4.带标题的表格
<table>
 <caption>……</caption> <!-表格标题,居中显示>
 <tr>
  <th>……</th>    
 </tr>
 <tr>
  <td>……</td>
 </tr>
</table>
5.带结构的表格
<table>
 <caption>……</caption>
 <thead> 
 <tr>
  <th>表头</th>    
 </tr>
 </thead>
 <tbody>
 <tr>
  <td>主体</td>
 </tr>
 </tbody>
 <tfoot>
 <tr>
  <td>脚注</td>
 </tr>
 </tfoot>
</table>
6.表格属性
(1)width 表格宽度
(2)border 表格边框宽度
(3)cellpadding 单元格边沿和内容之间的空白
(4)cellspacing 单元格之间的空白
(5)bgcolor 背景颜色
(6)frame 外边框样式
(7)rules 内边框样式
7.跨列属性colspan
<table>
 <tr>
  <td colspan="2">……</td>
  <td>……</td>    
 </tr>
 <tr>
  <td>……</td>
  <td>……</td>
  <td>……</td>
 </tr>
</table>
8.跨行属性rowspan
<table>
 <tr>
  <td rowspan="2">……</td>
  <td>……</td>    
  <td>……</td>
 </tr>
 <tr>
  <td>……</td>
  <td>……</td>
 </tr>
</table>
9.表格布局
(1)尽量少的使用表格嵌套
(2)尽量少的使用表格跨行跨列
(3)说明:使用表格进行网页结构布局一般不设置border

html:表格的更多相关文章

  1. HTML 表格<table><caption><th><tr><td><thead><tbody><tfoot><col><colgroup>

    <table>标签: 定义和用法: <table>标签定义HTML表格. 简单的HTML表格由table元素以及一个或多个tr.th或td元素组成. tr元素定义表格行,th元 ...

  2. html-3,table 表格标签 tr th td caption thead tbody tfoot 的简单使用

    <!-- table border='1' style="border-collapse:collapse;" border 表格的像素宽度 border-collapse: ...

  3. HTML表格,table,thead,tbody,tfoot,th,tr,td,的属性以及跨行,跨列

    在HTML中表格是作为一个整体来解析的,解析完才会在页面显示,如果表格很复杂很长,加载时间很长,用户体验就不好.所以这里就要用到表格结构标签,解析一部分就显示一部分,不用等表格全部加载完再显示. 表格 ...

  4. HTML——表格table标签,tr或者td

    表格定义和用法 <tr> 标签定义 HTML 表格中的行. tr 元素包含一个或多个 th 或 td 元素. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,tr 元素的 ...

  5. jQuery遍历table中的tr td并获取td中的值

    jQuery遍历table中的tr td并获取td中的值 $(function(){ $("#tableId tr").find("td").each(func ...

  6. table的thead,tbody,tfoot

    为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用tbody可以优化显示. 如果表格很长,用tbody分段,可以一部分一部分地显示 ...

  7. table样式测试总结tr td宽度分析

    题外话:一直以来习惯布局用ul,li样式调整比较方便,不会互相影响出现一些问题,but~现在公司涉及很多表格打印,都是用table写的,好多宽度高度合并啊,组合啊~~~,单元格之间互相影响,有的样式设 ...

  8. table标签修改tr,td标签的行距

    修改tr标签的行距,tbale标签的td标签间距 看如下Css文件的代码,其都没有table的tr行距产生效果 tr{ margin-top: 10px; padding: 10px; } td{ m ...

  9. thead tbody tfoot

    <!DOCTYPE html> <html lang="en"> <head> <title>Title</title> ...

  10. html5 表格标签 table tr td

      最重要的三个 <table>     表格声明标签 属性: boarder    边框粗细 style    可配合css 使用 <tr>    行标签 table row ...

随机推荐

  1. 3阶(次)贝塞尔曲线的JavaScript(JS)实现

    php中文网数学符号的显示太差了,推荐看这里 贝塞尔曲线简介:贝塞尔曲线,是贝塞尔老爷子在使用电子计算机设计汽车零件的时候 进行曲面设计而采用的一种参数化的样条曲线. 一般参数方程: B(t) = \ ...

  2. centos7.9重启后,主机名会变为IP地址

    现象: centos7.9重启后,主机名会变为IP地址 当关闭DHCP功能,则主机名修改生效,否则重启后,主机名依旧变为图示的IP地址 解决方法:经过排查,由 /etc/sysconfig/netwo ...

  3. struts2 显示表格

    <%@ taglib uri="/struts-tags" prefix="s"%> <h3>All Records:</h3&g ...

  4. tomcat8 无法解析 请求url 中 包含 [: 或者 :] 等特殊符号

    使用如下URL: http://127.0.0.1:8080/xx/[:xOGxeSSk5ENaYh89ziEFJA==:].do 如果使用tomcat8 无法正常访问,浏览器network 报错 4 ...

  5. lxml.etree.XMLSyntaxError: Opening and ending tag mismatch: meta line 4 and head, line 6, column 12 报错分析与解决方案

    报错分析: 我们检查代码没有任何问题,但报错显示:开始和结束标记不匹配. html:因为html是超文本标记语言,代码不规范也能解析. python:python是编程语言,代码不规范则解析不了. 解 ...

  6. springboot+mybatis多数据源的事务问题

    1.springboot+mybatis实现多数据源后,针对单个数据源我们可以使用@Transactional(name="xxxTransactionManager") 来指定使 ...

  7. Mysql数据库基础第二章:(十)联合查询

    Mysql数据库基础系列 软件下载地址 提取码:7v7u 数据下载地址 提取码:e6p9 mysql数据库基础第一章:(一)数据库基本概念 mysql数据库基础第一章:(二)mysql环境搭建 mys ...

  8. 2022-3-28内部群每日三题-清辉PMP

    1.由于一直重复执行相同的任务,一个敏捷团队的士气低落.敏捷管理专业人士(主题专家 SME)应采取哪一项行动? A.增加团队的资源数量,协助主题专家完成任务. B.让团队成员执行其活动的价值流分析. ...

  9. DEV GridControl 主从表 (层次表)

    DataTable dtData= DbHelperOra.Query(strSql2.ToString()).Tables[0]; //主表 dtusers.TableName = "病人 ...

  10. 杭电oj 数值统计

    Problem Description 统计给定的n个数中,负数.零和正数的个数.   Input 输入数据有多组,每组占一行,每行的第一个数是整数n(n<100),表示需要统计的数值的个数,然 ...