首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >HTML5简明教程(一)概述

HTML5简明教程(一)概述

作者头像
娜姐
发布2021-01-14 10:38:48
发布2021-01-14 10:38:48
79700
代码可运行
举报
文章被收录于专栏:娜姐聊前端娜姐聊前端
运行总次数:0
代码可运行

HTML5遵循的理念是不破坏原有HTML规则下,增加更多新功能,不仅仅是HTML标签,还涉及需要JavaScript支持的富Web应用开发,以及CSS3。

《深入浅出HTML5》将分为几个篇章对HTML5新特性进行介绍。

1. HTML5模板
代码语言:javascript
代码运行次数:0
运行
复制
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
</head>
<body>
// 内容
</body>
</html>
  • <!DOCTYPE html>: HTML5文档类型,默认会触发标准模式。如果不定义文档类型,浏览器会以混杂模式显示页面,不同浏览器的混杂模式不同,这样会导致页面在不同浏览器下显示不一致。
  • <html lang="en">: 为页面内容指定语言,这里使用英语。
  • <meta charset="UTF-8">: 定义字符编码,这里是使用UTF-8编码,支持中英文。
  • <link rel="stylesheet" href="style.css">: 定义外部样式表,不再需要type="text/css"属性。
  • <script src="script.js"></script>: 定义JavaScript,不再需要type="application/javascript"属性。
2. 新增元素
  • 构建页面的语义元素:<article>, <aside>, <figcaption>, <figure>, <footer>, <header>, <hgroup>, <nav>, <section>, <details>, <summary>,都是块级元素。
  • 标识文本的语义元素:<mark>, <time>, <wbr>,都是内联元素。
  • Web表单及交互:<input type="email/url/search/tel/number/range/date/color">, <datalist>, <keygen>, <meter>, <progress>, <command>, <menu>, <output>
  • 音频,视频和插件:<audio>, <video>, <source>, <embed>
  • 绘图Canvas:<canvas>
3. 浏览器支持

推荐工具 http://caniuse.com/ ,通过它可以查看浏览器对HTML5支持情况。比如canvas标签:

canvas support.png

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. HTML5模板
  • 2. 新增元素
  • 3. 浏览器支持
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档