- HTML教程
- HTML - 主页
- HTML - 概述
- HTML - 基本标签
- HTML - 元素
- HTML - 属性
- HTML - 格式设置
- HTML - 短语标签
- HTML - 元标签
- HTML - 注释
- HTML - 图像
- HTML - 表格
- HTML - 列表
- HTML - 文本链接
- HTML - 图像链接
- HTML - 电子邮件链接
- HTML - 框架
- HTML - Iframe
- HTML - 块
- HTML - 背景
- HTML - 颜色
- HTML - 字体
- HTML - 表单
- HTML - 嵌入多媒体
- HTML - 字幕
- HTML - 标题
- HTML - 样式表
- HTML - JavaScript
- HTML - 布局
HTML - 基本标签
标题标签
任何文档都以标题开头。您可以为标题使用不同的大小。HTML 还具有六级标题,它们使用元素<h1>、<h2>、<h3>、<h4>、<h5>和<h6>。显示任何标题时,浏览器会在该标题之前添加一行,在该标题之后添加一行。
例子
<!DOCTYPE html> <html> <head> <title>Heading Example</title> </head> <body> <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> </body> </html>
这将产生以下结果 -
段落标签
<p>标签提供了一种将文本组织成不同段落的方法。每个文本段落都应位于开始 <p> 和结束 </p> 标记之间,如下例所示 -
例子
<!DOCTYPE html> <html> <head> <title>Paragraph Example</title> </head> <body> <p>Here is a first paragraph of text.</p> <p>Here is a second paragraph of text.</p> <p>Here is a third paragraph of text.</p> </body> </html>
这将产生以下结果 -
换行标签
每当您使用<br />元素时,其后面的任何内容都从下一行开始。此标记是空元素的示例,其中不需要开始和结束标记,因为它们之间没有任何内容。
<br /> 标签在字符br和正斜杠之间有一个空格。如果省略此空格,较旧的浏览器将无法呈现换行符,而如果您错过了正斜杠字符而仅使用 <br>,则它在 XHTML 中无效。
例子
<!DOCTYPE html> <html> <head> <title>Line Break Example</title> </head> <body> <p>Hello<br /> You delivered your assignment ontime.<br /> Thanks<br /> Mahnaz</p> </body> </html>
这将产生以下结果 -
内容居中
您可以使用<center>标签将任何内容放置在页面或任何表格单元格的中心。
例子
<!DOCTYPE html> <html> <head> <title>Centring Content Example</title> </head> <body> <p>This text is not in the center.</p> <center> <p>This text is in the center.</p> </center> </body> </html>
这将产生以下结果 -
水平线
水平线用于在视觉上划分文档的各个部分。<hr>标记从文档中的当前位置到右边距创建一条线,并相应地断开该线。
例如,您可能想在两个段落之间划一条线,如下面给出的示例所示 -
例子
<!DOCTYPE html> <html> <head> <title>Horizontal Line Example</title> </head> <body> <p>This is paragraph one and should be on top</p> <hr /> <p>This is paragraph two and should be at bottom</p> </body> </html>
这将产生以下结果 -
同样,<hr />标记是空元素的一个示例,您不需要开始和结束标记,因为它们之间没有任何内容。
<hr />元素在字符hr和正斜杠之间有一个空格。如果省略此空格,较旧的浏览器将无法渲染水平线,而如果您错过了正斜杠字符而仅使用<hr>,则它在 XHTML 中无效
保留格式
有时,您希望文本遵循 HTML 文档中编写的确切格式。在这些情况下,您可以使用预格式化标签<pre>。
开始<pre>标记和结束</pre>标记之间的任何文本都将保留源文档的格式。
例子
<!DOCTYPE html> <html> <head> <title>Preserve Formatting Example</title> </head> <body> <pre> function testFunction( strText ){ alert (strText) } </pre> </body> </html>
这将产生以下结果 -
尝试使用相同的代码而不将其保留在<pre>...</pre>标签内
不间断空格
假设您想使用短语“12 Angry Men”。在这里,您不希望浏览器将“12,Angry”和“Men”分成两行 -
An example of this technique appears in the movie "12 Angry Men."
如果您不希望客户端浏览器中断文本,则应使用不间断空格实体 而不是一个正常的空间。例如,在段落中编码“12 Angry Men”时,您应该使用类似于以下代码的内容 -
例子
<!DOCTYPE html> <html> <head> <title>Nonbreaking Spaces Example</title> </head> <body> <p>An example of this technique appears in the movie "12 Angry Men."</p> </body> </html>
这将产生以下结果 -