从零开始的毕设--HTML&&CSS(1)

本文深入探讨了HTML5的新特性,包括定义导航链接的<nav>元素、页眉和页脚的<header>和<footer>元素、定义section和article的<section>和<article>元素、多媒体的<video>和<audio>元素、定义图形的<canvas>元素等。特别关注了<video>元素的使用,如控制条、自动播放和视频海报等功能,并讨论了浏览器对不同视频格式的支持情况。

HTML5新特性

我们用div是这样写的页面:
在这里插入图片描述
http://www.w3school.com.cn/html5/html5_reference.asp
<nav> 定义导航链接。
<header>定义 section 或 page 的页眉。
<footer>定义 section 或 page 的页脚。
<section> 定义 section。
<article> 定义 article。
<video> 定义视频。
<time>定义日期/时间。
<audio> 定义声音内容。
<aside> 定义页面内容之外的内容。
<canvas> 定义图形。
现在有以上新特性,我们的页面可以变成这样:
在这里插入图片描述在这里插入图片描述
在这里插入图片描述在这里插入图片描述
<vedio>元素如何工作

<video controls autoplay 
	width="512" height="288"
	src="../tweetsip.mp4"
	poster="images/poster.png"
	id="video"
></video>

controls:控制进度的条等等。
autoplay:自动播放。
poster:视频的海报。

  • 关于视频格式需要知道什么?
    HTML5允许任何视频格式,但是具体支持什么格式是由浏览器决定的。

处理所有的视频格式:

<video controls autoplay width="512" height="288">
	<source src="../tweetsip.mp4">
	<source src="../tweetsip.webm">
	<source src="../tweetsip.ogv">
	<p>浏览器不支持该视频</p>
</video>

建立表格
这里的表格不是表格布局,而是真正的表格。使用<table>元素。
在表格中,<table>表示这个表。
<tr>表示行
<th>表示某一列的表头
<td>表示单元格
在这里插入图片描述
在这里插入图片描述
表格可以增加一行标题
在这里插入图片描述
这里对表格不多做介绍。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值