html5 基础知识总结

W3C的建立

伯纳斯李1994年建立万维网联盟(W3C)

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

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

网页的结构思想

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

image-20210513001146250

结构、表现、行为

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

 nsyjg-dwl0d

文档声明(doctype)

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

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

布局标签
结构化语义标签

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

HTML5 语义元素

音视频
音频
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下,出现我们自定义的提示信息

image-20210516005054543

embed

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

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

<embed src="./source/audio.mp3">
image-20210516005207428

Guess you like

Origin blog.csdn.net/fish_study_csdn/article/details/121296360