HTML5与CSS3 Web前端开发技术第3章 HTML5的基本页面元素.pptVIP

3.5 表格元素 表格示例demo0315.html 3.5 表格元素 2. HTML表格的属性 HTML5支持的表格属性 设置表格边框宽度——border 设置单元格跨列——colspan 设置单元格跨行——rowspan ?表格的其他属性 表3-8 早期HTML支持的表格属性 属性名 说明 width 设置表格宽度 height 设置表格高度 bordercolor 设置表格边框颜色 bgcolor 设置表格的背景颜色 background 设置表格背景图像 align/ valign 设置表格对齐方式 cellspacing 设置单元格间距 cellpadding 设置单元格边距 3.5 表格元素 表格示例demo0316.html 3.5 表格元素 3.表格嵌套 在网页制作过程中，有时会用到嵌套的表格，即在表格的一个单元格中嵌套使用一个或者多个表格。 3.5 表格元素 3.表格嵌套 在网页制作过程中，有时会用到嵌套的表格，即在表格的一个单元格中嵌套使用一个或者多个表格。 3.6 内嵌框架 内嵌框架也叫浮动框架，是在浏览器窗口中嵌入子窗口，即将一个文档嵌入在另一个网页中显示。使用成对的iframe/iframe标记即可在网页中插入内嵌框架。 iframe src=url/iframe 属性 描述 src 设置源文件的地址 width 设置内嵌框架窗口宽度 height 设置内嵌框架窗口高度 bordercolor 设置边框颜色 align 设置框架对齐方式，可选值为left、right、top、middle、bottom name 设置框架名称，是链接标记的target所需参数 scrolling 设置是否显示滚动条，默认为auto，表示根据需要自动出现。Yes表示有，No表示无 frameborder 设置框架边框，1表示显示边框，0表示不显示（不提倡用yes或no） framespacing 设置框架边框宽度 marginheight 设置内容与窗口上下边缘的边距，默认为1 marginwidth 设置内容与窗口左右边缘的距离，默认为1 表3-9 内嵌框架属性 3.6 内嵌框架 1. src属性和name属性 图像示例demo0319.html 3.6 内嵌框架 2. width/height属性和scrolling属性 使用width和height属性设定内嵌框架窗口的大小 例如，tdiframe src=“test.html” height=“150” width=“300”/iframe/td，将test.html网页嵌入到框架中，内嵌窗口的宽度为300像素，高度为150像素。 使用scrolling属性指定内嵌窗口是否显示滚动条 例如语句，tdiframe src=test.html scrolling=no/iframe/td，表示定义test.html为内嵌网页，同时隐藏内嵌窗口的滚动条 3.7 页面基本元素的应用 1.多层嵌套列表示例——demo0316.html 3.7 页面基本元素的应用 2.旅游网站首页示例——demo0321.html 3.7 页面基本元素的应用 2.旅游网站首页示例——demo0321.html 3.7 页面基本元素的应用 3.内嵌框架示例——demo0322.html 3.7 页面基本元素的应用 3.内嵌框架示例——demo0322.html 作业 HTML5+CSS3 Web 前端开发技术 LOGO HTML5+CSS3 Web 前端开发技术 * 第3章 HTML5的基本页面元素 文本元素 1 列表元素 2 超链接元素 3 图像元素和多媒体元素 4 表格元素 5 内嵌框架 6 页面基本元素的应用 7 3.1 文本元素 1．段落标记p和换行标记br/ 段落标记p来描述段落。网页显示时，包含在p/p标记对中的内容会显示在一个段落里。 另起一行使用换行标记br/。 3.1 文本元素 2. 标题标记hn 通过设置不同级别的标题（Heading）标记，可以清晰表示出文档的结构。标题是通过h1～h66对标记进行定义的。h1定义最大的标题，h6 定义最小的标题。 3.1 文本元素 3.块标记div和span div和span标记都是用于定义页面内容的容器，，显示效果由style属性或CSS来定义。 div是一种块（block）容器，默认的状态是占据一行，而span是一个行间(inline) 容器，其默认状态是行间的一部分。 3.2 列表元素 1. 有序列表标记ol 有序列表是一个项目的序列，各项目前标有数字以表示顺序。有序列表由ol/ol标记对实现，在ol/ol标记之间使用成对的li/li标记添加列表项目。 3.2 列表元素 type属性