HTML5 迁移

从HTML4迁移到HTML5

这章完整的讲解了怎么从HTML4页面迁移到HTML5页面.

这章展示了怎么从HTML4页面转换为HTML5页面,没有破坏任何原文内容和结构.

你可以从HTML4或XHTML迁移到HTML5,只需用同一个方法.

典型的HTML4	典型的HTML5
{{item['tag4']}}	{{item['tag5']}}

一个典型的HTML4页面

例子

转换为HTML5文档类型

改变文档类型,从HTML4转换:

转换为HTML5类型:

例子

转换为HTML5编码

改变编码信息,从HTML4:

转换为HTML5:

例子

阅读关于HTML5浏览器支持章节.

给HTML5语义元素添加CSS

已存在的CSS样式

给HTML5语义元素复制相等的CSS样式:

例子

转换为HTML5的<header>和<footer>

改变<div>元素的id="header"和id="footer:"

改为HTML5语法<header>和<footer>元素:

例子

转换为HTML5的<nav>

转换带有id="menu"的<div>元素:

改为HTML5的<nav>元素:

例子

换成HTML5的<section>

替换带有id="content"的<div>元素:

替换为HTML5的<section>元素:

例子

替换为HTML5的<article>

替换所有带有class="post"的<div>元素:

替换为HTML5的<article>元素:

例子

删除不再用的<style>元素:

一个典型的HTML5页面:

最终你可以移除<head>标签.在HTML5里不需要它们了:

例子

<article>,<section>和<div>之间区别

在HTML5标准里,<article>,<section>和<div>它们之间有一些混淆.

在HTML5标准里,<section>元素被定义为相关的块元素.

<article>元素被定义为完整的且独立的相关块元素.

<div>元素被定义为子元素的块元素.

怎么来解释它们呢?

在上面的例子中,我们用<section>元素作为<article>的容器.

但是,我们也可以用<article>作为文章的容器.

下面是一些不同的例子:

<article>包含<article>

<article>包含<div>:

<article>包含<section>,<section>包含<div>:

评论区

()

21技术 www.21xrx.com 备案号：蜀ICP备17043188号-2

其它

提取图片文字免费的JetBrains license services json在线解析 base64加解密文章搜索