当前位置:
文档之家› HTML5教程HTML5 标准
HTML5教程HTML5 标准
• HTML文档的后缀名 • .html • .htm • 以上两种后缀名没有区别,都可以使用。
实例解析
• <!DOCTYPE html> 声明为 HTML5 文档 • <html> 元素是 HTML 页面的根元素 • <head> 元素包含了文档的元(meta)数
据 • <title> 元素描述了文档的标题 • <body> 元素包含了可见的页面内容 • <h1> 元素定义一个大标题 • <p> 元素定义一个段落
什么是HTML?
• HTML 是用来描述网页的一种语言。 • HTML 指的是超文本标记语
言: HyperText Markup Language • HTML 不是一种编程语言,而是一种标记
语言 • 标记语言是一套标记标签 (markup tag) • HTML 使用标记标签来描述网页 • HTML 文档包含了HTML 标签及文本内容 • HTML文档也叫做 web 页面
• HTML 段落 • HTML 段落是通过标签 <p> 来定义的. • 实例 • <p>这是一个段落。</p> <p>这是另外一个
段落。</p>
实例2
• <!DOCTYPE html> • <html> • <head> • <meta charset="utf-8"> </head> • <body> • <p>这是第一个段落。</p> • <p>这是第二个段落。</p> • <p>这是第三个段落。</p> • </body> • </html>
中文编码
• 目前在大部分浏览器中,直接 输出中文会 出现中文乱码的情况,这时候我们就需要 在头部将字符声明为 UTF-8
HTML 编辑器
• 每一种操作系统都带有简单的文本编辑器: • Windows 用户可以使用记事本; • Linux 用户可以选择几种不同的文本编辑器,
如 vi、vim 或者 emacs ; • Mac 用户可以使用 OS X 预装的 TextEdit。
• 浏览器并不是直接显示的HTML标签,但可 以使用标签来决定如何展现HTML页面的内 容给用户:
HTML 网页结构
• <html> <head> <title>页面标题</title> </head> <body> <h1>这是一个标题</h1> <p>这是一个段落。</p> <p>这是另外一个段落。</p> </body>
HTML erText Markup Language,简称:HTML)是一种 用于创建网页的标准标记语言。
• 您可以使用 HTML 来建立自己的 WEB 站 点,HTML 运行在浏览器上,由浏览器来 解析。
• 在本教程中,您将学习如何使用 HTML 来 创建站点。
HTML 元素
• "HTML 标签" 和 "HTML 元素" 通常都是描 述同样的意思.
• 但是严格来讲, 一个 HTML 元素包含了开始 标签与结束标签,如下实例:
• HTML 元素: • <p>这是一个段落。</p>
Web 浏览器
• Web浏览器(如谷歌浏览器,Internet Explorer,Firefox,Safari)是用于读取 HTML文件,并将其作为网页显示。
HTML 基础- 4个实例
• HTML 标题 • HTML 标题(Heading)是通过<h1> -
<h6> 标签来定义的. • 实例 • <h1>这是一个标题</h1> <h2>这是一个标
题</h2> <h3>这是一个标题</h3>
实例1
• <!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> • </body> • </html>
HTML 标签
<标签>内容</标签>
• HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
• HTML 标签是由尖括号包围的关键词,比
如 <html>
• HTML 标签通常是成对出现的,比如 <b>
和 </b>
• 标签对中的第一个标签是开始标签,第二 个标签是结束标签
• 开始和结束标签也被称为开放标签和闭合 标签
• HTML 链接 • HTML 链接是通过标签 <a> 来定义的. • 实例 • <a href="">这是一个
链接</a> • 提示:在 href 属性中指定链接的地址。
实例3
• <!DOCTYPE html> • <html> • <head> • <meta charset="utf-8"> • <title>菜鸟教程()</title> • </head> • <body>
• HTML 很容易学习!相信您能很快学会它!
HTML 实例
• <!DOCTYPE html> • <html> • <head> • <meta charset="utf-8"> • <title>网页教程()</title> • </head> • <body> • <h1>我的第一个标题</h1> • <p>我的第一个段落。</p> • </body> • </html>
• </html>
<!DOCTYPE> 声明
• <!DOCTYPE>声明有助于浏览器中正确显 示网页。
• 网络上有很多不同的文件,如果能够正确 声明HTML的版本,浏览器就能正确显示网 页内容。
• doctype 声明是不区分大小写的,以下方式 均可:
• <!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>