|
主题设置

卡片式面板通常用于非白色背景色的主体内

HTML 元素

HTML 文档由 HTML 元素组成,HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。HTML 标签

元素示例

元素 开始标签 元素内容 结束标签
<h1>这是标题一</h1> <h1> 这是标题一 </h1>
<p>这是一个段落</p> <p> 这是一个段落 </p>
<a href="link.html">这是一个链接</a> <a href="link.html"> 这是一个链接 </a>
<br /> <br />
换行标签 <br /> 是空元素,没有元素内容,也没有结束标签,以正斜杠 / 作为元素的结束标志。

元素语法

HTML 元素以开始标签起始,以结束标签终止。

元素内容是开始标签和结束标签之间的内容。

一些 HTML 元素没有内容,被称之为空元素,比如 换行标签 <br /> 。

空元素在开始标签中进行关闭,通常用以正斜杠 / 表示关闭,当然也可以省略斜杠 /,比如 <br> 。

大多数 HTML 元素可以拥有属性,比如 <a href="link.html">这是一个链接</a>,其中 href 就是属性,link.html 是属性值。

HTML 元素

元素类型

HTML 元素可以分为三大基本类型:

  • 块级元素(block level element),独占一行。
  • 行内元素(inline level element),其所在的行,还可以有其他行级元素。
  • 行内块元素(inline block element),同时具备行内元素和块级元素的特征,其所在的行还可以有其他行内块元素或行内元素。

元素嵌套

大部分 HTML 元素可以嵌套其他 HTML 元素。

如 HTML 文档的头部可以嵌套 元数据 和 标题:

<head>
	<meta charset="UTF-8" />
	<title>元素嵌套</title>
</head>

不要忘记结束标签

如果忘记了结束标签,现在大多数的 Web 浏览器也能够正确的显示 HTML,这是因为能容忍小毛病是它们一直以来的设计目标。

但我们依然要保证使用有效、合适的文档,而不是依靠浏览器的内建错误处理机制来正确的显示它们。因为忘记使用结束标签会产生不可预料的结果或错误。

比如下面的例子:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>忘记结束标签</title>
	</head>
	<body>
		<h1>我的第一个标题
		<p>我的第一个段落。
	</body>
</html>
尝试一下

使用小写标签

由于 HTML 标签对英文字母的大小写不敏感,所以 <P> 和 <p> 表达的意思相同,不过大部分网站喜欢使用大写的 HTML 标签。

本站(笔记本代码)使用的是小写标签,因为万维网联盟(W3C)在 HTML 4 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。

如何查看源代码

你是否看过一些网页然后惊叹它是如何实现的?

如果您想找到其中的奥秘,只需要单击右键,然后选择"查看源文件"(IE)或"查看页面源代码"(Firefox),其他浏览器的做法也是类似的。这么做会打开一个包含页面 HTML 代码(元素)的窗口。