html5 表格标签 table tr td
最重要的三个
<table> 表格声明标签
属性:
- boarder 边框粗细
- style 可配合css 使用
<tr> 行标签 table row 有表就可以建行
<td> 单元格标签 table data 有行就可以建数据
属性:
- colspan data占用格子, 或者可以理解为这个单元格要合并多少个横向的单元格.
- rowspan 纵向占用格子…
<th> tablehead 单元格表头, 特殊类td, 由于表头的文字都会居中加粗, 是有一点不一样.
<!-- table 是表格声明标签, tr是一行, td是一格 -->
<table
border="1" style="width: 300px;">
<!-- board 边框属性, 值越大越粗 style是配合css一起使用的, 设置行宽px是像素为单位. -->
<tr>
<td>第一行,第一格</td>
<td>第一行,第二格</td>
<td>第一行,第三格</td>
</tr>
<tr>
<td>第2行,第一格</td>
<td>第2行,第二格</td>
<td>第2行,第三格</td>
</tr>
<br>
<table
border="1" style="width: 300px;"> <!-- 复制的 -->
<tr>
<td>第一行,第一格</td>
<td>第一行,第二格</td>
<td>第一行,第三格</td>
</tr>
<tr>
<td>第2行,第一格</td>
<td>第2行,第二格</td>
<td>第2行,第三格</td>
</tr>
<tr>
<td>只有一格</td>
</tr>
<tr>
<td
colspan="3">只有一格,共占3格</td>
表的结构排序<thead><tbody><tfoot>
<tr>有多行, 有时候数据很多, 不一定能顾及前后, thead等的语义就是强制吧thead包括的内容全部调到第一展示. 而tfoot调到最后. 这是一个编程的规范
<table>
<thead>
<td>1</td>
</thead>
<tbody>
<td>2</td>
</tbody>
<tfoot>
<td>3</td>
</tfoot>
</table>
<caption> 表的标题, 在框外.
background 通用属性, 用于颜色控制
注,此方法设置列的颜色行不通.
<colgrounp>
这个只能设置第一列是红色, 不能设置指定列的颜色.
如果是<colgroup style="background:red;"span =2> <colgroup> span=2 只能是前两列而不是第二列
两种正确的方法
1.先设置第一列的颜色,在设置第二列颜色
2.使用col占位符
html5 表格标签 table tr td的更多相关文章
- HTML中表格元素TABLE,TR,TD及属性的语法
table:表格元素及属性 <table width="80%" border="1" cellspacing="1" cellpad ...
- html5常用标签table表格布局
html5常用标签table表格布局 一.总结 一句话总结: 二.html5常用标签table表格布局 用表格显示信息调理清楚,使浏览者一目了然.表格在网页中还有协助布局的作用,可以把文字.图像等组织 ...
- HTML+css基础 表格标签table Table标签属性 td标签属性
表格标签table: 他是由行与列构成,最小单位是单元格. 行标签 <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...
- 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、!!!表格标签<table>
表格标签 <table> 代表表格 width:指表格的宽度 一种是像素 (浏览器缩小的时候出现滚动条) 一种是百分比(跟着浏览器的大小而大小) b ...
- 前端 HTML body标签相关内容 常用标签 表格标签 table
表格标签 table 表格由<table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由<td>标签定义).字母 td 指表 ...
- html表格中的tr td th用法
表格是html中经常使用到的,简单的使用可能很多人都没问题,但是更深入的了解的人恐怕不多,下面我们先来看一下如何使用. <table>是<tr>的上层标签 <tr&g ...
- 关于html与css的标签及属性(text文本属性、背景background属性、表格标签table、列表、)
text文本属性1.颜色 colorcolor:red: 2.文本缩进text-indant属性值 num+px text-indant:10px:3.文本修饰 text-decoration属性值: ...
- html中table,tr,td
table表格,tr表格中的行,tr表格中的列,等级关系是table>tr>td, 当然表格中还包括thead,tbody,tfoot,th,但由于浏览器支持缘故很少使用.另外table在 ...
- jQuery操作Table tr td常用的方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
随机推荐
- easyui datagrid combobox下拉框获取数据问题
最近在使用easyui的datagrid,在可编辑表格中添加一个下拉框,查了下API,可以设置type : 'combobox',来做下拉框,这下拉框是有了,可是这后台数据怎么传过来呢,通过查API可 ...
- 【290】Python 函数
参考:Python 函数 参考:7.3 给函数参数增加元信息(增加参数的数据类型) 目录: 一.语法 二.说明 三.参数传递 四.参数 4. 1 必备参数 4.2 关键字参数 4.3 缺省参数 4.4 ...
- url_encode and url_decode in Shell
之前写过一版 shell下解码url,下面给出另外一个版本 from https://gist.github.com/cdown/1163649 function urlencode() { loca ...
- springmvc jpa
昨天帮同学搭建了一个springmvc+jpa+beetl模板引擎的项目环境,供参考. https://files.cnblogs.com/files/startnow/lntu-demo.zip 数 ...
- 运行Junit方法项目启动不了
从控制台看不出任何有用信息,通过JUnit右键”Copy Failure List”将信息拷贝出来 TestStart.start initializationError(org.junit.runn ...
- 前端中this的用法
this指的是方法下的所有参数 handleDelete(record){ this.XXX.AAA (这个this.XXX指的是handleDelete这个方法的所有参数) (let self = ...
- Android开发实战之拥有Material Design风格的侧滑布局
在实现开发要求中,有需要会使用抽屉式布局,类似于QQ5.0的侧滑菜单,实现的方式有很多种,可以自定义控件,也可以使用第三方开源库. 同样的谷歌也推出了自己的侧滑组件——DrawLayout,使用方式也 ...
- cdoj915-方老师的分身 II (长度不小于k的最短路)【spfa】
http://acm.uestc.edu.cn/#/problem/show/915 方老师的分身 II Time Limit: 10000/5000MS (Java/Others) Memo ...
- Struts2概述
-------------------siwuxie095 Struts2 概述 1.Struts2 是应用在 Java EE 三层架构中的 Web 层的框架 2.Struts2 是在 Struts1 ...
- 第十一条理解objc_masgSend的作用
Objetive-C最基本的的东西就是它的消息机制.Objective-C运行时的最基本的东西就是 objc_msgSend, 它就是负责发送一个消息给对象的C函数. 当你写下面这样的代码时: ...