HTML列表,表格与媒体元素
一.列表 信息资源的一种展示形式 二.列表的分类 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.定义列表 <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:自动播放 loop:循环播放 五.iframe内联框架 <iframe src="嵌套的页面地址" name="内联框架名称" width="200px" height="200px"></iframe> 点击链接跳转到指定地址: <a href="fristHtml.html" target="iframe">内联框架第一个页面</a> <a href="secondHtml.html" target="iframe">内联框架第二个页面</a> <a href="thridHtml.html" target="iframe">内联框架第三个页面</a> <iframe src="fristHtml.html" name="iframe" width="200px" height="200px"></iframe>
HTML列表,表格与媒体元素的更多相关文章
- HTML列表,表格与媒体元素
一.无序列表 <ul> <li>无序列表</li> <li>有序列表</li> <li>自定义列表</li> < ...
- HTML第二章:列表,表格,媒体元素
第二章:列表,表格,媒体元素 列表:有三种,有序列表,无序列表,定义列表 1.有序列表:<ol></ol> 列表项:<li></li&g ...
- 【学习笔记】HTML基础:列表、表格与媒体元素
一.列表是信息资源的一种展现形式,它可以使信息结构化和条理化,并以列表的样式显示出来,以便浏览者能够快速的获取相应的信息. 1.无需列表 <ul> <li>第一项</li ...
- HTML5 第二章 列表和表格和媒体元素
列表: (1)什么是列表? 列表就是信息资源的一种展示形式. (2)无序列表: 语法: <ul> <li>第1项</li> <li>第2项</li ...
- HTML的列表,表格与媒体元素
一.无序列表 <ul> <li>无序列表</li> &l ...
- HTML5 列表、表格、媒体元素
无序列表 <ul> <li>范冰冰演藏族女孩</li> <li>拍集体合影后自拍</li> <li>诗隆甜蜜出游</li& ...
- 第48天学习打卡(HTML 行内元素和块元素 列表 表格 视频和音频 页面结构分析 iframe内联框架 表单语法 )
行内元素和块元素 块元素 无论内容多少,该元素独占一行 (p.h1-h6) 行内元素 内容撑开宽度,左右都是行内元素的可以排在一行 (a.strong.em...) 列表 什么是列表 ...
- Bootstrap框架(基础篇)之列表,表格,表单
继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...
- CSS 笔记——列表表格
6. 列表表格 -> 列表 (1)list-style 基本语法 list-style : list-style-image || list-style-position || list-sty ...
随机推荐
- 在.net core中数据操作的两种方式(Db first && Code first)
在开发过程中我们通常使用的是Db first这种模式,而在.net core 中推荐使用的却是 code first 反正我是很不习惯这种开发模式 于是就搜寻整个微软的官方文档,终于找到了有关.net ...
- Python进阶----SOCKET套接字基础, 客户端与服务端通信, 执行远端命令.
Python进阶----SOCKET套接字基础, 客户端与服务端通信, 执行远端命令. 一丶socket套接字 什么是socket套接字: 专业理解: socket是应用层与TCP/IP ...
- fulltext全文索引的使用
Fulltext全文索引 Fulltext相关属性 查看数据库关于fulltext的配置 SHOW VARIABLES LIKE 'ft%'; -- ft就是FullText的简写 ft_boolea ...
- vuecli3的项目搭建
1.卸载旧版本 npm uninstall vue-cli -g 或者 yarn global remove vue-cli 2.安装cli3脚手架 npm install -g @vue/cli 或 ...
- js对象的深入理解(六)
一.对象的创建(四种模式)1.工厂模式工厂模式示例: function createPerson(name,age){ var obj = { name:name, age:age, sayName: ...
- 【OGG】OGG的单向复制配置-支持DDL(二)
[OGG]OGG的单向复制配置-支持DDL(二) 一.1 BLOG文档结构图 一.2 前言部分 一.2.1 导读 各位技术爱好者,看完本文后,你可以掌握如下的技能,也可以学到一些其它你所不知道的 ...
- 使用awrsqrpt.sql查看执行计划demo
SQL> @?/rdbms/admin/awrsqrpt.sql Current Instance ~~~~~~~~~~~~~~~~ DB Id DB Name Inst Num Instanc ...
- vue父组件触发子组件方法
比如应用场景是弹窗中的组件,想要点弹窗时更新该组件展示对应记录的的值 methods: { edit (record) { this.mdl = Object.assign({}, record) t ...
- vue2 手记
vue2 手记 Vue文档:https://cn.vuejs.org/v2/api/#provide-inject Vue 生命周期:https://cn.vuejs.org/v2/guide/ins ...
- HTML&CSS基础-xHtml语法规范
HTML&CSS基础-xHtml语法规范 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源码 <!DOCTYPE html> <html> ...