第二章
列表、表格与媒体元素
1.列表
1.无序列表
<ul>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
注:无顺序;每个<li>标签独占一行;默认<li>标签前有个实心小圆点
2.有序列表
<ol>
<li>...</li>
<li>...</li>
<li>...</li>
</ol>
注:有顺序;每个<li>标签独占一行;默认<li>标签前有顺序标记
3.定义列表
<dl>
<dt>...</dt>
<dd>...</dd>
<dd>...</dd>
</dl>
注:没有顺序;每个<dt>标签、<dd>标签独占一行;默认没有标记;用于一个标题下有一个或多个列表项的情况
2.表格
1.基本语法
<table border="n"> //表格标签,n为表格列数(n为0或缺失border时,无边框)
<tr> //行标签
<td>第一个单元格内容</td> //单元格标签
<td>第二个单元格内容</td>
...
</tr>
</table>
2.表格的跨列
<td colspan="n">单元格的内容</td> //“n”为所跨的列数(合并的列数)
3.表格的跨行
<td rowspan="n">单元格的内容</td> //“n”为所跨的行数(合并的行数)
3.媒体元素
1.基本语法
<video src="视频路径" controls></video>
注:“controls”为提供播放、暂停和音量的控件
2.视频格式
<video controls>
<source src="视频地址" type="视频格式"/>
</video>
例:<source src="video/video.mp4" type="video/mp4"/>
3.自动播放属性
<video autoplay>
<source src="视频地址" type="视频格式"/>
</video>
4.音频元素
1.基本语法
<audio src="音频路径" controls></video>
注:“controls”为提供播放、暂停和音量的控件
例:<audio controls>
<source src="music/music.ogg" type="audio/ogg"/>
</audio>
5.页面结构
1.HTML5结构元素
例:
<header><h2>网页头部</h2></header>
<section><h2>网页主体部分</h2></section>
<footer><h2>网页底部</h2></footer>
6.内联框架
1.基本语法
<iframe src="path" name="mainFrame"></iframe>
注:“path”为引用页面地址;“mainFrame”为框架标识名;可设置scr的属性值为http://www.bdqn.cn,在此页面中可打开一个线上网页
2.<iframe>属性(实现页面间的相互跳转)
在被打开的框架上加name属性
<iframe name="识别名" src="跳转页面地址"/></iframe>
注:用于设置iframe窗口,一条对应一个窗口,每多一条都会设置一个新的窗口;
此处的“跳转页面地址”为默认打开的页面,不影响后续的其他页面的打开
3.在超链接上设置target目标窗口属性为希望显示的框架窗口名
<a href="跳转页面地址" target="识别名">超链接关键词</a>
注:用于切换iframe窗口中的页面
总注:
实现功能为页面内iframe窗口中,切换不同页面;
“识别名”和“跳转地址”的用法为基本超链接跳转应用,2.3.两个代码对应使用;
多个“超链接”可通过设置相同的“识别名”链接同一inframe窗口,使用效果为点击不同的超链接,在同一inframe窗口中切换对应的页面
待解决问题:
插入iframe窗口后,已有的图片和文本会被覆盖
解决方法:
查看代码<iframe src="path" name="mainFrame">(iframe窗口设置代码)后是否加上代码</iframe>(结束语句),若未加上则会出现被覆盖的情况