html5 基础知识总结

2023-10-03 16:54:40

W3C的建立

伯纳斯李1994年建立万维网联盟（W3C）

W3C的出现为了制订网页开发的标准，以使同一个网页在不同的浏览器中有相同的效果。

所以，我们需要制订我们编写的网页都需要遵循W3C的规范！

网页的结构思想

根据W3C标准，一个网页主要由三部分组成：结构、表现还有行为。

结构、表现、行为

结构（骨架）：HTML用于描述页面的结构
表现（皮肤）：CSS用于控制页面中元素的样式
行为（交互）：JavaScript用于响应用户操作

文档声明（doctype）

文档声明用来告诉浏览器当前网页的版本

<!-- html5的文档声明 -->
<!doctype html>
<!-- 或者 -->
<!Doctype HTML>

布局标签
结构化语义标签

header表示网页的头部（页眉）
main表示网页的主体部分（一个页面中只会有一个main）
footer表示网页的底部（页脚）
nav表示网页中的导航
aside和主体相关的其他内容（侧边栏）
article表示一个独立的文章
section表示一个独立的区块，上边的标签都不能表示时使用section

音视频
音频
audio标签用来向页面中引入一个外部的音频文件

音视频文件引入时，默认情况下不允许用户自己控制播放停止

属性：

controls是否允许用户控制播放
autoplay音频文件是否自动播放
如果设置了autoplay，则音乐在打开页面时会自动播放
但是目前来讲大部分浏览器都不会自动对音乐进行播放
loop音乐是否循环播放
<audio src="./source/audio.mp3" controls autoplay loop></audio>

source

除了通过src属性来指定外部文件的路径以外，还可以通过<source>元素来指定文件的路径

<audio controls autoplay loop>
    对不起，您的浏览器不支持播放音频！请升级浏览器！
	<source src="./source/audio.mp3">
	<source src="./source/audio.ogg">
</audio>

IE11下，能够正常播放

IE8下，出现我们自定义的提示信息

embed

IE8下不支持audio元素，但是可以使用 <embed> 元素在文档中的指定位置嵌入外部内容。

这个内容是由外部应用程序或其他互动内容的来源提供的，如浏览器插件。

码农公寓

W3C的建立

网页的结构思想

文档声明（doctype）

source

embed

相关文章