一些不常见的html表格设置【转载】

最新推荐文章于 2021-06-29 15:02:27 发布
最新推荐文章于 2021-06-29 15:02:27 发布
阅读量807 收藏
点赞数
分类专栏： HTML 文章标签： html 旅游 border table web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cugwei/article/details/539672
版权

定义性列表

　　定义性列表可以用来给每一个列表项再加上一段说明性文字，说明独立于列表项另起一行显示。在应用中，列表项使用标签<DT>标明，说明性文字使用<DD>表示。在定义性列表中，还有一个属性是COMPACT,使用这个属性后，说明文字和列表项将显示在同一行。其结构如下所示：

　　　　<DL>
　　　　<DT>第一项 <DD>叙述第一项的定义
　　　　<DT>第二项 <DD>叙述第二项的定义
　　　　<DT>第三项 <DD>叙述第三项的定义
　　　　</DL>

例：

<html>
<head>
<title>定义性列表</title>
</head>

<body>
这是一个定义性列表：<P>
<DL>
　<DT>WWW<DD>WWW是全球信息网(World wide web)的缩写，也有人称之为3W、W3、Web。
　<DT>Hyper Text<DD>Hyper Text是超文本。文件通过超文本，可链结到其它地方的数据文件，取得分散在各地的数据。
<DL>

</body>
</html>

表格的基本结构

　<table>...</table> 　定义表格
　<caption>...</caption>　定义标题
　<tr> 　定义表行
　<th> 　定义表头
　<td> 　定义表元(表格的具体数据)

以下是一个简单的例子：

<table border=1>

<tr><th>姓名</th><th>性别</th><th>年龄</th>

<tr><td>王林</td><td>男</td><td>25</td>      

</table>

表格的标题

　　表格标题的位置，可由ALIGN属性来设置，其位置分别由表格上方和表格下方。下面为表格标题位置的设置格式。

　　设置标题位于表格上方：

　　　　<caption align=top> ... </caption>

　　设置标题位于表格下方：

　　　　　<caption align=bottom> ... </caption>

<table border>
　<caption align=top>旅游日程</caption>
　<tr>
　　　<th>日期</th><td>9-11</td><td>11-13</td><td>13-14</td>
　<tr>
　　　<th>旅游地点</th><td>青岛</td><td>黄山</td><td>杭州</td>
</table>

显示结果：


旅游日程 　

日期9-1111-1313-14
旅游地点青岛黄山杭州

<table border>
　<caption align=bottom>旅游日程</caption>
　<tr>
　　　<th>日期</th><td>9-11</td><td>11-13</td><td>13-14</td>
　<tr>
　　　<th>旅游地点</th><td>青岛</td><td>黄山</td><td>杭州</td>

</table>

日期9-1111-1313-14
旅游地点青岛黄山杭州


旅游日程

表格的标题

　　表格标题的位置，可由ALIGN属性来设置，其位置分别由表格上方和表格下方。下面为表格标题位置的设置格式。

　　设置标题位于表格上方：

　　　　<caption align=top> ... </caption>

　　设置标题位于表格下方：

　　　　　<caption align=bottom> ... </caption>

<table border>
　<caption align=top>旅游日程</caption>
　<tr>
　　　<th>日期</th><td>9-11</td><td>11-13</td><td>13-14</td>
　<tr>
　　　<th>旅游地点</th><td>青岛</td><td>黄山</td><td>杭州</td>
</table>

显示结果：


旅游日程 　

日期9-1111-1313-14
旅游地点青岛黄山杭州

<table border>
　<caption align=bottom>旅游日程</caption>
　<tr>
　　　<th>日期</th><td>9-11</td><td>11-13</td><td>13-14</td>
　<tr>
　　　<th>旅游地点</th><td>青岛</td><td>黄山</td><td>杭州</td>

</table>

日期9-1111-1313-14
旅游地点青岛黄山杭州


旅游日程

cugwei
关注
专栏目录
html标签大全（转载）
07-19
本文档将详细介绍常用的HTML标签，包括文字、图片、表格、表单、框架等。 一、文字标签 1. 标题文字：<h#>...</h#> #=1~6，h1为最大字，h6为最小字 这是一个大标题 这是一个小标题 2. 字体变化：<font>... 【1...
html表格··表格样式··长表格
qq_72174695的博客
07-14 781
表格 表格样式 长表格
html中设置表格宽度不一致,为什么我的HTML表格不符合我的CSS列宽？
weixin_30771489的博客
06-21 1164
我有一个HTML表格,我希望前几列很长.我在CSS中这样做:td.longColumn{width: 300px;}这是我的表的简化版本[ . . and a bunch more columns . . .]出于某种原因,当有很多列时,该表似乎使该列<300px.我基本上希望它保持宽度,无论如何(只是增加水平滚动条).容器,表里面,没有任何类型的最大宽度,所以我想不通为什么它挤压此列中,而...
如何设置HTML表格的长度不一样,HTML表格的大小怎么设置
weixin_32121147的博客
06-27 2230
回答：一般来说，一个文档中所有页面纸张大小、页边距和纸张方向都一样，但某些时候会遇到一部分页面要求用 A4 纸，另一部分页要求用 A3 纸，或者第一页用 A4 纸，第二页用 B5 纸，第三页之后全用 A3 纸；或者第一页要求纵排，第二页要求横排，第三页又要求纵排，第四页之后要求全部横排等，也就是同一文档或要求设置不同的纸张大小、或要求设置不同的页边距、纵页或横页；所有这些要求在 Word 的页面设...
html一个表格中行列距离不一样,详解html中表格table的行列合并问题解决
weixin_32226023的博客
06-29 1096
因为要做个网站，里面的内容除了大段文字之外，还有大量的表格，这就发现了表格排版的问题。一般简单的表格，例如：这种形式就比较简单，只要简单地将(或者就行了代码如下：但是到了一些比较错落的就需要用到colspan(跨列)和rowspan(跨行)了。colspan(跨列)和rowspan(跨行)就是表面意思，也可以看为行列合并。colspan(跨列)：上图中红色部分即为此格已跨两列。代码如下(仅是部分代...
java开发html转pdf示例(转载)
04-16
此外，`iText`库也有许多高级功能，如页面设置、字体管理、表格、列表等，可以根据需求进一步探索和利用。 总结来说，使用Java进行HTML转PDF的核心是理解如何结合`core-renderer.jar`和`iText-2.0.8.jar`库，通过...
web前端工程狮 HTML 笔记
10-01
2.2 HTML 表格与表单元素表格()用于展示结构化数据，由多个相关标签组成，如（行）、（表头单元格）和（数据单元格）。例如： ```html 姓名 年龄 张三 <td>25 ``` 表单()用于收集用户输入，常见...
JS/jQuery实现超简单的Table表格添加,删除行功能示例
01-19
最近需要表格添加删除行,添加行简单,删除行就有点儿懵逼了,于是网上找实例,功夫不负有心人,终于让我找到了,下面的是代码,大家觉得可以,记得点赞哦!!!谢谢! 需要的拿去,转载请在明显的位置标注出出处!!! <html&gt...
转载的 动力节点 html基础教程一部分 陆续上传
09-15
7. **表格**：`<table>`元素用于创建表格，`<tr>`定义行，`<th>`定义表头，`<td>`定义数据单元格。 8. **段落与换行**：` `标签用于插入换行，`<p>`标签创建段落，它们是文本布局的基本组件。 9. **链接与导航*...
html不自动延伸,html – tbody width不会自动延伸到表的宽度
weixin_35682992的博客
05-31 238
看看这个例子在这里：而“规格”下的红色表格并没有成为包含它的全部宽度 – 当在Firebug上进行检查时，div不是220像素，而是基于内容宽度只有100像素。type:Houseyear:1986CSS代码如下所示：#listing_specs table {width: 100%;}#listing_specs table tbody {display: table-row-group;wid...
解决table表格溢出错乱的问题
pankay的专栏
12-25 1921
项目背景：   在做一个邮件自动推送数据报表的任务时，发现在不同的邮件客户端中，报表布局会错乱，特别是outlook中css样式，浮动布局容易溢出，foxmail对html的支持倒是很不错。 经过测试，发现不管是新型邮件客户端还是老的对table布局支持很好，邮件中采用table布局符合需求。 出现的table溢出异常截图 代码：
使用table标签制作常用的html表格
Ataraxia的专栏
11-15 3272
table 标签用于定义 HTML 表格。简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。 tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head><sty
rowspan与colspan属性
11-29 1980
rowspan跨行数colspan 跨列数汗今天神州数码的笔试考到了这个一时居然没有想出来 郁闷啊
js打印当前页面的代码
11-29 1832
function PrintIt(){    window.print()} onmouseover="this.value=打印该页" onmouseout="this .value=打印">
表单的隐式提交 form.submit
12-26 1553
表单的隐式提交 form.submit 时如果出现教本错误“对象不支持属性或方法”说明在你的页面里面有一个按钮的name属性值为submit改正即可
网页另存为功能【转载】
11-29 1367
document.execCommand(saveas)Web开发人员都有过这样的疑问，如何让一个文件，尤其是一个已知类型的文件，发送到客户端，直接提示让浏览者下载，而不是用与它相关联的程序打开。以前我们最常用的办法就是把这样的文件加到链接上，这样可以让浏览者通过点击鼠标右键的目标另存为来下载所链接的文件。但是，这样有两个不足的地方： 一是：如果浏览器能够识别已下载文件的扩展名，则浏览器就会激
几个使用的js工具函数
11-29 1053
对sString字符串进行后空格截除对sString字符串进行前空格截除对sString字符串进行前后空格截除限制文本输入框中只能输入数字"0"到"9",".","-"限制文本中输入框中只能输入数字"0"到"9"，"."限制文本中输入框中只能输入数字"0"到"9"限制文本中输入框中只能输入日期格式自动将输入文本框中的内容转换成小写字符 自动将输入文本框中的内容转换成大写字符 取得字符串的长度（中文
使用jsp实现word、excel格式报表打印【转载】
12-09 886
因为ms word和excel的文档都支持html文本格式，因此可以先用word或excel做好模版，另存为Web页，然后将该html改成jsp，将数据部分动态填入即可，不用很辛苦的调整格式 word页面只要在jsp头设置如下指令： excel如下：使用这种方式客户端必须安装有office软件，用户访问时将在ie中直接用word或excel打开该页面。此方法优势是模板设计、调整方便，无需在服务器端
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值