table标签的学习
来源:互联网 发布:stg环境数据 编辑:程序博客网 时间:2024/06/18 09:19
关于table标签的一些学习,先将它总结一下
1. table标签的用法和定义
这里引用的是W3Cschool上的说法:
表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
代码:<table ><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
效果:
row 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 2写法由<table></table>
标签包括,<tr></tr>
标签为行,在tr中包含列标签<td></td>
,如果代码td标签直接由table标签包括,将默认是一行,如下所示:
<table ><td>row 1, cell 1</td><td>row 1, cell 2</td><td>row 2, cell 1</td><td>row 2, cell 2</td></table>
row 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 22. 表格的常用属性
3. 合并单元格
如何合并单元格呢,使用相关属性进行设置
说起来可能比较绕,但是自己试一试就马上明白了。
示例:
①合并列colspan=”2”
<table ><tr><td colspan="2">row 1, cell 1</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
row 1, cell 1row 2, cell 1row 2, cell 2②合并行rowspan=“2”
<table ><tr><td rowspan="2">row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 2</td></tr></table>
row 1, cell 1row 1, cell 2row 2, cell 2③排挤情况
<table ><tr><td colspan="2">row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
row 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 2<table ><tr><td rowspan="2">row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
row 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 23.其他
①表头
使用<th></th>
标签,标签会将单元格的内容自动变为居中粗体
<tr><th>表头1</th><th>表头2</th></tr>
②表格中的空单元格
最好使用空格符
占位,以便显示出边框属性
<td> </td>
row 1, cell 1row 1, cell 2 row 2, cell 2③框架(frame)属性
frame 属性无法在 Internet Explorer 中正确地显示,使用好可以有很多有用的效果。
<table frame="box"><table frame="above"><table frame="below"><table frame="hsides"><table frame="vsides">
另外一些属性也可以去W3Cschool*查看
阅读全文
0 0
- table标签的学习
- table标签的属性
- HTML学习---------1.18 table标签
- html table标签的使用
- <table> 标签的 rules 属性
- 对于table标签的使用
- 关于<table>标签的样式
- HTML的<table>标签基础
- jQuery学习笔记(2)--table标签切换
- HTML学习之路05-table标签
- 第三节 HTML标签深入学习之Table标签
- Table 标签
- <table>标签
- table标签
- <table>标签
- 【table】标签
- table标签
- <table></table>标签
- Redis 简介
- Docker Error response from daemon: client is newer than server
- 常见的8种排序算法
- Java图标对应的文件类型
- PHP内核探索:从SAPI接口开始
- table标签的学习
- JNI全局对象,及原生线程JNIENV传递
- 自定义SeekBar样式
- 安装AgularJS的全过程
- hibernate的原生语句
- 软件版本命名规范与举例
- sails开发之mongoDB数据库连接
- stop-all.sh
- 用友uap nc65开发自定义档案开发