HTML5学习笔记(一)-认识HTML5


本文摘自PHP中文网,作者黄舟,侵删。

什么是 HTML5?


HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。

HTML 的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。

HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。

HTML5 新规则:


  • 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。

  • 减少对外部插件的需求(比如 Flash)

  • 更优秀的错误处理

  • 更多取代脚本的标记

  • HTML5 应该独立于设备

  • 开发进程应对公众透明

新特性


HTML5 中的一些有趣的新特性:

  • 用于绘画的 canvas 元素

  • 用于媒介回放的 video 和 audio 元素

  • 对本地离线存储的更好的支持

  • 新的特殊内容元素,比如 article、footer、header、nav、section

  • 新的表单控件,比如 calendar、date、time、email、url、search

浏览器支持


最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。

HTML基础讲解


1. 声明:<!DOCTYPE>

 HTML也有多个不同的版本, 只有完全明白页面中使用的确切HTML版本, 浏览器才能完全正确地显示HTML页面. 这就是<!DOCTYPE>的用处.

 HTML5:

1

<!DOCTYPE html>

HTML4.01:

1

2

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

XHTML1.0:

1

2

3

<!DOCTYPE html

        PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

2. HTML基础标签

  head, body

  • HTML 标签是由尖括号包围的关键词,比如 <html>

  • HTML 标签通常是成对出现的,比如 <b> 和 </b>

  • 标签对中的第一个标签是开始标签,第二个标签是结束标签

  • 开始和结束标签也被称为开放标签和闭合标签

  • 1

    <html><head></head><body><h1>My First title</h1><p>here is the first paragraph.</p></body></html>

  例:

  • <html> 与 </html> 之间的文本描述网页

  • <head>与</head> 之间的是head部分

  • <body> 与 </body> 之间的文本是可见的页面内容

  • <h1> 与 </h1> 之间的文本被显示为标题

  • <p> 与 </p> 之间的文本被显示为段落

3. HTML标题

  <h1>...<h6>等标签进行定义

1

2

3

4

5

6

7

8

9

10

11

12

13

14

<!DOCTYPE html><html><head>

    <meta charset="UTF-8">

    <title>基础</title>

    </head>

    <body>

    <h1>标题1</h1>

    <h2>标题2</h2>

    <h3>标题3</h3>

    <h4>标题4</h4>

    <h5>标题5</h5>

    <h6>标题6</h6>

    <p>这是我的第一个H5程序</p>

    </body>

    </html>

3. HTML段落

  <p>标签定义段落

4. HTML连接

  <a> 标签定义连接

1

<a href="www.baidu.com">找度娘</a>

5. HTML图像

  <img>标签定义图像

1

<img src="照片的路径, 可以是网络的, 可以是本地的">

以上就是HTML5学习笔记(一)-认识HTML5的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

HTML5中的nav标签的详解

HTML5程序员需要学习的技能总结

HTML5边玩边学(一)-画布详解

HTML5在线预览pdf格式的代码

HTML5新增加的标签有哪些

利用js+HTML5实现图片上传预览效果(实例)

HTML5开发手机打电话发短信功能代码实例分享

HTML5中如何提高网站前端性能的示例代码分析

h5拖放api进行拖放排序

head标签中有什么属性?

更多相关阅读请进入《HTML5》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...