表格(TABLE)标记(TAGS)详细介绍_HTML/Xhtml_网页制作
程序员文章站
2022-03-19 12:45:16
...
表格的基本语法
...
- 定义表格
- 定义表行
- 定义表头
- 定义表元(表格的具体数据)
带边框的表格:
边框尺寸设置:
表格尺寸设置:
表元间隙设置:
表元内部空白设置:
#=left, center, right
#=top, middle, bottom, baseline
#=space value
... #=left, center, right
... #=top, bottom
Lunch
复制代码
代码如下:Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
不带边框的表格:
复制代码
代码如下:Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
跨多行、多列的表元(Table Span)
跨多列的表元
复制代码
代码如下:Morning Menu | ||
---|---|---|
Food | Drink | Sweet |
A | B | C |
Morning Menu | ||
---|---|---|
Food | Drink | Sweet |
A | B | C |
跨多行的表元
复制代码
代码如下:Morning Menu | Food | A |
---|---|---|
Drink | B | |
Sweet | C |
Morning Menu | Food | A |
---|---|---|
Drink | B | |
Sweet | C |
表格尺寸设置
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
表格内文字的对齐/布局
复制代码
代码如下:Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
复制代码
代码如下:Food | Drink | Sweet | Other |
---|---|---|---|
A | B | C | D |
Food | Drink | Sweet | Other |
---|---|---|---|
A | B | C | D |
表格在页面中的对齐/布局(Floating Table)
Food | Drink | Sweet |
---|---|---|
A | B | C |
My favorites...
cookies, chocolates, and more.
Food | Drink | Sweet |
---|---|---|
A | B | C |
My favorites...
cookies, chocolates, and more.
Food | Drink | Sweet |
---|---|---|
A | B | C |
My favorites...
cookies, chocolates, and more.
Food | Drink | Sweet |
---|---|---|
A | B | C |
My favorites...
cookies, chocolates, and more.
Food | Drink | Sweet |
---|---|---|
A | B | C |
My favorites...
cookies, chocolates, and more.
表格的标题
复制代码
代码如下:Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
valign=top is default.
复制代码
代码如下:Food | Drink | Sweet |
---|---|---|
A | B | C |
Food | Drink | Sweet |
---|---|---|
A | B | C |
声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
相关文章
相关视频
专题推荐
-
独孤九贱-php全栈开发教程
全栈 170W+
主讲:Peter-Zhu 轻松幽默、简短易学,非常适合PHP学习入门
-
玉女心经-web前端开发教程
入门 80W+
主讲:灭绝师太 由浅入深、明快简洁,非常适合前端学习入门
-
天龙八部-实战开发教程
实战 120W+
主讲:西门大官人 思路清晰、严谨规范,适合有一定web编程基础学习
推荐阅读
-
HTML表格标记教程(45):表格的表主体标记_HTML/Xhtml_网页制作
-
HTML表格标记教程(29):单元格的亮边框色属性BORDERCOLORLIGHT_HTML/Xhtml_网页制作
-
HTML的10个表格相关标记_HTML/Xhtml_网页制作
-
HTML表格标记教程(21):行的边框色属性BORDERCOLOR_HTML/Xhtml_网页制作
-
表格标签(table)深入了解_HTML/Xhtml_网页制作
-
HTML表格标记教程(14):表格的表头_HTML/Xhtml_网页制作
-
HTML标记语言——表格标记_HTML/Xhtml_网页制作
-
HTML表格标记教程(47):表格嵌套_HTML/Xhtml_网页制作
-
HTML表格标记教程(45):表格的表主体标记_HTML/Xhtml_网页制作
-
HTML表格标记教程(22):行的亮边框色属性BORDERCOLORLIGHT_HTML/Xhtml_网页制作
网友评论
文明上网理性发言,请遵守 新闻评论服务协议
我要评论