重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
HTML怎么制作表格?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
目前成都创新互联已为近1000家的企业提供了网站建设、域名、网络空间、网站托管、服务器租用、企业网站设计、巴马网站维护等服务,公司将坚持客户导向、应用为本的策略,正道将秉承"和谐、参与、激情"的文化,与客户和合作伙伴齐心协力一起成长,共同发展。
在html中绘制表格使用table标签
tr表示行
td表示列
th表示表头,表头通常用于列名字。
下面是一个列子。
Table in html 水平表头
Name | Age | Gender |
---|---|---|
zdd | 30 | male |
垂直表头
Name | autumn |
---|---|
Age | 30 |
Gender | famale |
效果图
水平表头
Name | Age | Gender |
zdd | 30 | male |
垂直表头
Name | autumn |
Age | 30 |
Gender | famale |
无边框表格
如果在定义表格时,没有指定border属性,那么表格就没有边框
zdd | 30 |
ddz | 27 |
效果图
zdd | 30 |
ddz | 27 |
空单元格
如果没有为单元格指定内容,那么单元格将是空的,且没有边框,如下,这样很不美观。
zdd | 30 |
27 |
如果解决呢?方法是给空的单元格加上空格,由于html忽略多余的空格,所以我们不能直接加空格,而要加 nbsp表示空格。
zdd | 30 |
20 |
效果图
zdd | 30 |
20 |
带标题的表格
使用caption属性,但是好像标题中不能有空格,否则显示的时候会换行!
zdd | 30 |
20 |
我的表格
zdd | 30 |
20 |
跨行或者跨列的表格
用colspan跨行
姓名 | 电话 | |
---|---|---|
Bill Gates | 555 77 854 | 555 77 855 |
姓名 | 电话 | |
Bill Gates | 555 77 854 | 555 77 855 |
用rowspan跨列
姓名 | Bill Gates |
---|---|
电话 | 555 77 854 |
555 77 855 |
嵌套的表格
table标签是可以嵌套的,也就是说在tr或者td标签中加入table标签即可创建表格中的表格。
看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注创新互联行业资讯频道,感谢您对创新互联的支持。