html表格居中在网页中间
对于html的元素居中其实只有两类居中,一是块元素居中,二是内联元素居中。内联元素居中使用text-align,块元素居中使用margin。一、内联元素内联元素居中,使用原则就是在其父元素上设置tex...
2024.11.20表格元素详解与练习
提到表格,大家最先想到的就是EXCEL这款软件,实际上在对表格的操作上,HTML与EXCEL非常相似。
在展示数据,统计数据方面,表格比文字描述更具表达优势,在网页中,表格也经常被用来展示数据、计划日常安排等内容。如图所示:
今天我们就来学习一下如何向页面中添加表格元素。
首先来介绍一下表格元素中的基本标签。
NO.1:
这个标签是书写表格的第一个标签,它本身在页面上看不出什么内容,但是它的属性可以控制表格显示的全局样式。这个标签的开始标签写在表格元素的开头,结尾标签写在表格元素的结尾。
NO.2:
这个标签是表格的标题标签。
NO.3:
这个标签定义表格的列标签。
NO.4:
这个标签是列表标题标签,例如,男生、女士、姓名等。
NO.5:
这个标签定义表格的行标签。
OK,这些基本标签就可以构建一个基础的表格元素。示例代码如下:
表格标题标题标签姓名年龄一列一行一列二行二列一行二列二行
页面效果如图所示:没有表格的外边框。
如何添加外边框呢?在标签中修改border属性即可,示例代码如下:border="1"是给表格添加宽为1的边界线。
效果如图所示:
这时,您会发现表格在页面上的尺寸非常小,可不可以按照页面尺寸来显示表格吗?当然可以,这就需要为标签修改第二个属性width,示例代码如图所示:width = "100%"指的是表格宽度与平面宽度一致。
效果如图所示:
ok!今天的讲解先到这里,明天我会继续为大家讲解、、三个标签,以及合并单元格操作。
今天的完整代码示例如下:
第一个网页 第一个网页表格元素表格标题姓名年龄一列一行一列二行二列一行二列二行正所谓万丈高楼平地起,html技术虽然简单,但是内容相对繁琐,也是以后进一步学习网页制作的基础,希望大家动手写每一段代码,把每一步踩坚实。
喜欢的小伙伴请关注我,阅读中遇到任何问题请给我留言,如有疏漏或错误欢迎大家斧正,不胜感激!
HTML完整学习目录对于html的元素居中其实只有两类居中,一是块元素居中,二是内联元素居中。内联元素居中使用text-align,块元素居中使用margin。一、内联元素内联元素居中,使用原则就是在其父元素上设置tex...
2024.11.20一、什么是合并单元格?一个表格中分为 行 和 列 ,有时候你经常在网页中看到类似这样的表格,有时候是合并了列,有时候是合并了行。那么这个是怎么做的?也是通过下面的方法实现的。二、怎么合并?向单元格添加...
2024.11.22外部连结 外部连结(全视窗连结) 属性:href 连接目标 值可以是url地址也可以是连接锚点 或者 name 连接名称 语法格式: 例: 连接到该锚点的连接则应是: target目标窗口语法格...
2024.11.18IE浏览效果图HTML5代码XXX中心小学课程表XXX中心小学课程表时间节次星期一星期二星期三星期四星期五上午一语文数学英语语文数学二英语音乐数学英语语文三体育英语美术品德科学下午四数学科学语文音乐社...
2024.11.201.表格的制作1、表格元素–表格中的行–表格中的列–表格中的表头–【居中/加粗】table标记的边框–bordertable标记的宽度–widthtable标记的高度–heighttable标记的水平...
2024.11.22