HTML5-基础知识点

这篇文章距离上次修改已过450天，其中的内容可能已经有所变动。

HTML5是HTML的最新标准，它在原有的基础上增加了很多新特性，比如画布（Canvas）、视频（Video）和音频（Audio）播放等。下面是一些HTML5的基础知识点和示例代码：

文档类型声明：HTML5的文档类型声明与HTML4不同，更简洁。




<!DOCTYPE html>
<html>
<head>
    <title>页面标题</title>
</head>
<body>
    <h1>这是一个标题</h1>
    <p>这是一个段落。</p>
</body>
</html>

语言属性：可以设置在<html>标签中，指定页面内容的语言。




<html lang="en">

元数据元素：<meta>标签可以用来提供元数据。




<meta charset="UTF-8">

视频元素：HTML5引入了<video>标签用于嵌入视频。




<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  您的浏览器不支持视频标签。
</video>

画布元素：HTML5引入了<canvas>标签用于绘图。




<canvas id="myCanvas" width="200" height="100">
  您的浏览器不支持Canvas。
</canvas>

音频元素：HTML5引入了<audio>标签用于嵌入音频。




<audio controls>
  <source src="song.ogg" type="audio/ogg">
  <source src="song.mp3" type="audio/mpeg">
  您的浏览器不支持音频元素。
</audio>

新的表单输入类型：HTML5提供了许多新的表单输入类型。




<form>
    姓名：<input type="text" name="name"><br>
    生日：<input type="date" name="bday">
    <input type="submit">
</form>

新的元素：如<header>, <nav>, <section>, <article>, <aside>, <footer>等，有利于SEO和代码结构化。




<header>
    <h1>我的网站</h1>
</header>
<nav>
    <ul>
        <li>主页</li>
        <li>关于</li>
    </ul>
</nav>
<section>
    <h2>最新新闻</h2>
    <article>
        <h3>新闻标题</h3>
        <p>新闻内容...</p>
    </article>
</section>
<aside>
    侧边栏内容...
</aside>
<footer>
    <p>版权所有 © 2023</p>
</footer>

这些是HTML5的一些基础知识点和示例代码，HTML5还有很多其他的特性和用法，需要根据实际开发需求学习和使用。

HTML5-基础知识点

评论已关闭

推荐阅读