HTML5基础学习资料（二）

在上一篇文章的基础上，本文演示一些 HTML5 中常用的元素

在本文中，我们先从一个最简单的 HMTL5 页面开始。首先建立一个空白的页面，命名为: index2.html, 代码如下:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Document</title>
    
	<base target="_blank" />
</head>
<body>

</body>
</html>

在这个空白的 HTM5 页面中，我们定义了基本的结构，同时，介绍了一个新的属性： base

当我们定义 base 的 target 属性时，代表: 默认设置链接从新的窗口打开，可能的值为:

_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self
这个目标的值对所有没有指定目标的 a 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题
标签中的 target 属性一起使用。
_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中，那么它与目标 _self 等效。
_top
这个目标使得文档载入包含这个超链接的窗口，用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。

target的值可以被 a 链接覆盖当前掉。

除了 target, base 还有一个常用的属性: href, 该属性定义了基准URL, 例如:

1	<base href="www.mls-tech.info/">

则表明该页面所有的相对路径规定默认的基准URL为 www.mls-tech.info，如果有一个标记

1	<img src="img/1.jpg">

那么，实际的地址为: www.mls-tech.info/img/1.jpg

h1 ~ h6 标签

h1-h6标题标签，文字的大小依次减小，在文档中的重要性也依次变小,标题一般只用一次, 宽度独占一整行

在 body 中加入

<h1 style="background-color:red;">this is heading1</h1>
<h2 style="background-color:red;">this is heading2</h2>
<h3 style="background-color:red;">this is heading3</h3>
<h4 style="background-color:red;">this is heading4</h4>
<h5 style="background-color:red;">this is heading5</h5>
<h6 style="background-color:red;">this is heading6</h6>

p 标签

p标签，段落标签，宽度占据一整行, 高度适应文本高度

1
2

<p style="background-color:green;">这是我的第一个段落文章，有点丑，因为没有样式</p>
<p style="background-color:green;" id="htmltext">超文本标记语言，标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。<br> 超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。</p>

blockquote 标签

用于引用一大段话，自动缩进

<blockquote style="background:green;">超文本标记语言，标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容</blockquote>

code 和 pre 标签

code 用于告诉浏览器内部是代码,大小适应内容

int a = 10; for(int i= 0;i&lt;10;i++)<br>
	<code>
		int a = 10; for(int i= 0;i&lt;10;i++)
	</code>
	<br>

	for(int a =10; i &lt; 100; i++){
		print("%d",i);
	}
	<br>

pre 标签为预处理标签，告诉浏览器内容愿样式显示，保留空格换行等