列表表格以及媒体元素

Posted 2021-01-17 xiao-ran

一、列表

　　信息资源的一种展现形式

二、列表的分类

　　1.有序列表

　　　　<ol>

　　　　　　<li/>内容1</li>

　　　　　　<li>内容2</li>

　　　　</ol>

　　默认每一个li前有顺序标识

　　2.无序列表

　　　　<ul>

　　　　　　<li>内容1</li>

　　　　　　<li>内容2</li>

　　　　</ul>

　　默认每一个li前有一个实心小圆点

　　3.定义列表　　

　　　　<!--dh标签同样代表 列表项的开始类似于dt标签-->

　　　　<dl>

　　　　　　<dt>列表项1</dt>

　　　　　　<dd>列表项1值1</dd>

　　　　　　<dd>列表项1值2</dd>

　　　　</dl>

　　没有顺序，每一个dt和dd标签独占一行

　　默认没有标记

三.表格

　　<table>

　　　　<tr>

　　　　<th>第一行第一个单元格</th>

　　　　<th>第一行第二个单元格</th> 

　　　　</tr>
　　　　<tr>

　　　　<td>第二行第一个单元格</td>

　　　　<td>第二行第二个单元格</td>

　　　　</tr>

　　</table>

　　跨行（rowspan）和跨列（colspan）：横向跨列，纵向跨行

四.音频和视频元素

　　※使用时注意浏览器兼容问题
　　<video controls="controls">

　　　　<source src="../video/video.webm"/>

　　　　<source src="../video/video.mp4"/>

　　</video>

　　<audio controls autoplay>

　　　　<source src="../music/music.mp3"/>

　　　　<source src="../music/music.ogg"/>

　　</audio>
　　controls:播放插件    autoplay:自动播放

五.iframe内联框架

　　<iframe src="嵌套的页面地址" name="内联框架名称" width="200px" height="200px"></iframe>
　　点击链接跳转到指定地址:
　　<a href="fristhtml.html" target="ifrmae">内联框架第一个页面</a>
　　<a href="secondHtml.html" target="ifrmae">内联框架第二个页</a>
　　<a href="thridHtml.html" target="ifrmae">内联框架第三个页面</a>
　　<iframe src="fristHtml.html" name="ifrmae" width="200px" height="200px"></iframe>