网站首页 > 技术文章 正文
表格
表格标记用于显示类似工作表的数据,这些数据以行和列的形式整齐地格式化。它们还可以用于设计页面布局。
表格 - <table> ... </table>
table标记用于定义表格,它包含所有行和列标记及其内容。表格必须始终至少有一行,有一些属性来定义表格布局。
- width="?" - 指定表格的宽度
- align="?" - 指定表格的水平对齐
- border="?" - 表格的边框大小
- cellspacing="?" - 单元格的间距
- cellpadding="?" - 单元格内容与边框的空白
表格标题 - <caption> ... </caption>
标记caption用于定义表格的标题。
行 - <tr> </tr>
tr标记表示表格中的行,必须出现在table标记中。
单元格 - <td> </td>
单元格是内容所在的地方,单元格必须存在于行中,行中的单元格数决定表中的列数,使用以下属性设置单元格属性:
- align="?" - 单元格中文本的水平对齐: left, center or right
- valign="?" - 单元格中文本的垂直对齐: top, middle or bottom.
- width="?" - 指定单元格的固定宽度,默认情况下只占据内容所需的空间
- colspan="?" - 列横跨允许单元格占据多列
- rowspan="?" - 行横跨允许单元格占据多行
- nowrap - 单元格中的文本不会换行到下一行。类似于段落的nobr标记
表头单元格 - <th> </th>
与普通单元格类似,表头单元格必须出现在行中,正常情况下位于表格第一行,浏览器对其进行加粗和居中。
例子
以下是表格的示例:
- 上一篇: 稀疏数组——前端电子表格中的应用实战
- 下一篇: 纯前端表格控件SpreadJS:六个常见的基础问题
猜你喜欢
- 2024-09-29 HTML之CSS表格 html table css
- 2024-09-29 SpreadJS 纯前端表格控件新特性 – 语言包
- 2024-09-29 SpreadJS 纯前端表格控件应用场景:全面预算编制
- 2024-09-29 前端开发基础课分享9--网页数据展示利器,教你使用表格
- 2024-09-29 超高效 Vue pc端表格解决方案Vxe-Table
- 2024-09-29 Luckysheet 纯前端的excel表格 前端在线excel
- 2024-09-29 「续」2023年前端WebExcel表格4+热门方案!
- 2024-09-29 第5天 | 16天搞定前端,html布局,表格和大块头
- 2024-09-29 浅谈web前端中的表格布局与CSS盒子布局
- 2024-09-29 纯前端表格控件SpreadJS V14.0发布
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端react (48)
- 前端md5加密 (49)
- 前端路由 (55)
- 前端数组 (65)
- 前端定时器 (47)
- 前端接口 (46)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle约束 (46)
- oracle 中文 (51)
- oracle链接 (47)
- oracle的函数 (57)
- mac oracle (47)
- 前端调试 (52)
- 前端登录页面 (48)
本文暂时没有评论,来添加一个吧(●'◡'●)