列表 ,表格与媒体元素基础

一.列表
信息资源的一种展示形式

二.列表的分类
1.有序列表
<ol>
<li>列表项1</li>
<li>列表项2</li>
</ol>

特性:
1.有顺序,每一个li独占一行
2.默认每一个li前有顺序标识

2.无序列表
<ul>
<li>列表项1</li>
<li>列表项2</li>
<ul>

特性:
1.没有顺序,每一个li独占一行(块元素)
2.默认每一个li前有一个实心小圆点

3.定义列表
<!--dh标签同样代表 列表项的开始类似于dt标签-->
<dl>
<dt>列表项1</dt>
<dd>列表项1值1</dd>
<dd>列表项1值2</dd>

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

特性:
1.没有顺序,每一个dt和dd标签独占一行
2.默认没有标记
三.表格
<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>

原文地址:https://www.cnblogs.com/qinzhenyu/p/9857639.html

时间: 2024-11-08 03:39:14

列表 ,表格与媒体元素基础的相关文章

列表,表格,与媒体元素

一.无序列表 <ul> <li>无序列表</li> <li>有序列表</li> <li>自定义列表</li> </ul> 特性:1.没有顺序,每个<li>标签独占一行(块级元素) 2.默认每一个li标签前有一个实心小圆点 3.主要用于无序类型信息的展示,如导航栏等 二.有序列表 <ol> <li>无序列表</li> <li>有序列表</li>

列表 表格与媒体元素

无序列表及其应用 语法<ul><li>第一项</li><li>第二项</li><li>第三项</li></ul>遵循W3c的标准<ul>标签里只能嵌套<li>标签,不能嵌套其他标签.<li>标签里可以嵌套任何标签. 无序列表的特征 (1)没有顺序,每一个<li>独占一行(块元素)(2)默认<li>标签项前面都有一个实心小圆点(3)一般用于无序类型的列表

列表表格及媒体元素

一.列表 信息资源的一种展示形式 二.列表的分类 1.有序列表  <ol>   <li>列表项1</li>   <li>列表项2</li>  </ol>    特性:   1.有顺序,每一个li独占一行            2.默认每一个li前有顺序标识  2.无序列表  <ul>   <li>列表项1</li>   <li>列表项2</li>  <ul>   

HTML5 第二章 列表和表格和媒体元素

列表: (1)什么是列表? 列表就是信息资源的一种展示形式. (2)无序列表: 语法: <ul> <li>第1项</li> <li>第2项</li> <li>第3项</li> </ul> (3)有序列表: 语法: <ol> <li>第1项</li> <li>第2项</li> <li>第3项</li> </ol> (4

第二章 列表、表格与媒体元素

一.无序列表 <ul>       <li>无序列表</li>       <li>有序列表</li>       <li>自定义列表</li>      </ul> 特性:1.没有顺序,每个<li>标签独占一行(块级元素)        2.默认每一个li标签前有一个实心小圆点        3.主要用于无序类型信息的展示,如导航栏等 二.有序列表 <ol>       <li&

第二章:列表、表格与媒体元素

1.无序列表及其应用 语法: <ul> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ul> 遵循W3c的标准<ul>标签里只能嵌套<li>标签,不能嵌套其他标签. <li>标签里可以嵌套任何标签. 2.无序列表的特征 (1)没有顺序,每一个<li>独占一行(块元素) (2)默认<li>标签项前面都有一个实心小圆点

HTML5 列表、表格、媒体元素

无序列表 <ul> <li>范冰冰演藏族女孩</li> <li>拍集体合影后自拍</li> <li>诗隆甜蜜出游</li> <li>一线城市楼市退烧</li> </ul> 特性 没有顺序,每个<li>标签独占一行(块元素) 默认<li>标签项前面有个实心小圆点  有序列表 <ol> <li>范冰冰演藏族女孩</li> <l

Bootstrap框架(基础篇)之列表,表格,表单

继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>…</li> </ul> 有序列表 <ol> <li>…</li> </ol> 定义列表 <dl> <dt>…</dt> <dd>…</dd> </dl> Bootst

web前端与移动开发---html列表、表单元素等标签的学习

经过前两天的学习,今天我们来学习列表及表单元素. 首先是列表,列表分为无需列表.有序列表.自定义列表. 1.无序列表 <ul> <li></li> <li></li> ...... </ul> 总结: (1)所有放在ul中的数据必须是无序的: (2)ul标签是用来管理li标签的: (3)ul中必须至少有一个li标签: (4)li标签不能单独使用: (5)在ul标签中只能写li标签: (6)在li标签中才能嵌套其他的标签. 2.有序列表