html:表格
1.表格三标签:
(1)<table> 表格
(2)<tr> 行
(3)<td> 单元格
<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:表格的更多相关文章
- HTML 表格<table><caption><th><tr><td><thead><tbody><tfoot><col><colgroup>
<table>标签: 定义和用法: <table>标签定义HTML表格. 简单的HTML表格由table元素以及一个或多个tr.th或td元素组成. tr元素定义表格行,th元 ...
- html-3,table 表格标签 tr th td caption thead tbody tfoot 的简单使用
<!-- table border='1' style="border-collapse:collapse;" border 表格的像素宽度 border-collapse: ...
- HTML表格,table,thead,tbody,tfoot,th,tr,td,的属性以及跨行,跨列
在HTML中表格是作为一个整体来解析的,解析完才会在页面显示,如果表格很复杂很长,加载时间很长,用户体验就不好.所以这里就要用到表格结构标签,解析一部分就显示一部分,不用等表格全部加载完再显示. 表格 ...
- HTML——表格table标签,tr或者td
表格定义和用法 <tr> 标签定义 HTML 表格中的行. tr 元素包含一个或多个 th 或 td 元素. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,tr 元素的 ...
- jQuery遍历table中的tr td并获取td中的值
jQuery遍历table中的tr td并获取td中的值 $(function(){ $("#tableId tr").find("td").each(func ...
- table的thead,tbody,tfoot
为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用tbody可以优化显示. 如果表格很长,用tbody分段,可以一部分一部分地显示 ...
- table样式测试总结tr td宽度分析
题外话:一直以来习惯布局用ul,li样式调整比较方便,不会互相影响出现一些问题,but~现在公司涉及很多表格打印,都是用table写的,好多宽度高度合并啊,组合啊~~~,单元格之间互相影响,有的样式设 ...
- table标签修改tr,td标签的行距
修改tr标签的行距,tbale标签的td标签间距 看如下Css文件的代码,其都没有table的tr行距产生效果 tr{ margin-top: 10px; padding: 10px; } td{ m ...
- thead tbody tfoot
<!DOCTYPE html> <html lang="en"> <head> <title>Title</title> ...
- html5 表格标签 table tr td
最重要的三个 <table> 表格声明标签 属性: boarder 边框粗细 style 可配合css 使用 <tr> 行标签 table row ...
随机推荐
- SQL Server【提高】碎片
碎片 当对索引所在的基础数据表进行增删改时,若存储的数据进行了不适当的跨页(SQL Server中存储的最小单位是页,页是不可再分的),就会导致索引碎片的产生. 外部碎片 插入的数据使页与页之间造成断 ...
- android HttpURLConnection ,HttpClient设置Cookie
上一阶段项目设计使用cookie信息实现登录访问功能,在实现过程遇到一些问题,下面整理一下: 首先,client想使用cookie,必须访问一次server从会话中获取cookie信息,然后在设置回去 ...
- Github的.gitignore忽略文件
Git中有一个非常重要的一个文件-----.gitignore 1.当然如果已经push了怎么办?当然也有解决方法,如下: 有时候在项目开发过程中,突然心血来潮想把某些目录或文件加入忽略规则,按照上述 ...
- NOIP2022 游记
无论结局如何,我都曾经来过. Day -1 zak 模拟赛,被殴打了. Day 0 上午 补模拟赛题. 下午 补模拟赛题. 徐老师过来分配了第二天下午造数据名单. 我造 T2.希望不会太难.(flag ...
- PHPStudy设置局域网访问
PHPStudy是一款轻量级PHP服务器,搭建环境迅速.但是与XAMPP之类服务器不同的是,PHPStudy默认只有本机才能设置域名.访问网站.需要更改vhost.conf中的文件,才可以使得内网可以 ...
- yzh 总线选讲
分布式:通过总线,我们可以用"通信""消息"等视角,把各个模块拆成各个小状态机,每个小状态机互相之间独立,通过总线通信 集中式:通过一个大状态机生成所有控制信号 ...
- vue 鼠标拖拽
<template> <div class="home"> <div id="box" v-drag></div> ...
- C++实现链式表示多项式加法运算
#include<iostream>#include<cstdlib>using namespace std;#define MAXSIZE 100#define OK 1#d ...
- shell脚本操作mysql通用脚本
作用:可以在写监控脚本时,将结果值保存到mysql数据库 使用方法:sh 脚本 库名称.表名称 字段=值 字段=值 字段=值 1.脚本 [root@localhost tmp]# cat writ_ ...
- vue中,解决chrome下,的warning, Added non-passive event listener to a scroll-blocking ‘mousewheel‘ event 问题
写项目的时候,Chrome 提醒: [Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' eve ...