HTML 基本标签
最后一次修改 2017年08月03日
HTML基本标签
HTML H1-H6
h1 元素表示标题。HTML定义了标题元素的层次结构，其中 h1 是排名最高的。
其它标题元素是 h2 ， h3 到 h6 。
相同排名的标题会分解内容，以便每个主题都在其自己的部分。
下面的代码使用h1 到 h3元素。
<!DOCTYPE HTML> <html> <body> <h1>This is h1.</h1> <p>I like XML.</p> <h2>Additional h2</h2> <p>I like XML.</p> <h3>More information</h3> <p>I like XML.</p> <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> <h1>Basic Text Formatting</h1> <p>The purpose of a web browser is to read HTML documents and compose them into visible or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page. HTML describes the structure of a website semantically along with cues for presentation, making it a markup language rather than a programming language. </p> <h2>White Space and Flow</h2> <p>HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. It can embed scripts written in languages such as JavaScript which affect the behavior of HTML web pages.</p> <h2>Creating Headings</h2> <p> Web browsers can also refer to Cascading Style Sheets (CSS) to define the look and layout of text and other material. The W3C, maintainer of both the HTML and the CSS standards, encourages the use of CSS over explicit presentational HTML.</p> </body> </html>
组标题与hgroup
hgroup 元素允许您处理多个标头元素作为单个项目，而不会影响HTML文档的大纲。
以下代码使用 hgroup 元素。
<!DOCTYPE HTML><html><body> <hgroup> <h1>H1</h1> <h2>H2</h2> </hgroup> <h2>Additional</h2> <h3>More information</h3> <h1>H1</h1> <p>This is a test.</p> <h2>H2</h2> This is a test. <h3>H3</h3></body></html>
HTML线
hr 元素表示水平规则。一条横跨页面的线。
以下代码使用 hr 元素。
<!DOCTYPE HTML><html><body> <p> This is a test. </p> <hr/> <p>This is another test. </p></body></html>
div结构
div 元素不具有特定的含义。 div 元素创建结构。
div 元素是 span 元素的 block 。块元素开始新行，而行内元素保持在同一行。
以下代码使用 div 元素。
<!DOCTYPE HTML><html><style>.favorites {
background: grey; color: white; border: thin solid black; padding: 0.2em;
}</style></head><body>
<div class="favorites">
<p>This is a test.</p>
<p>This is another test.</p>
</div>
<p>This is a test.</p></body></html>span元素
span 元素本身没有意义。
您将使用它将一个全局属性应用于内容区域。
以下代码显示了与类属性一起使用的 span 元素。
<!DOCTYPE HTML>
<html>
<style>
.myClass {
border: thin solid black;
padding: 1px;
}
</style>
</head>
<body>
I like <span class="myClass">CSS</span> and
<span class="myClass">HTML</span>.
</body>
</html>HTML段落
p 元素表示一个段落。
段落是包含一个或多个相关句子的文本块。
以下代码显示如何使用 p 元素到示例内容。
<!DOCTYPE HTML><html><body> <p> I code in CSS. </p> <p> HTML is good. </p> <p> This is the third paragraph. </p></body></html>
pre - 预格式化内容
在 pre 元素中，空格不会折叠，并保留格式。当内容的一部分的原始格式是重要的时，这可能是有用的。
当您使用代码元素时， pre 元素可能特别有用。
在编程语言中的格式化，例如，通常是显着的。
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<pre>
<code>
var fruits = ["XML", "HTML", "CSS", "Java"];
for (var i = 0; i < fruits.length; i++) {
document.writeln("I like " + fruits[i]);
}
</code>
</pre>
</body>
</html>HTML引用
blockquote 元素表示从另一个来源引用的块内容。
这个元素类似于 q 元素，但通常适用于较大数量的引用内容。
可以使用 cite 属性以提供内容的原始源的URL。
以下代码使用 blockquote 元素。
<!DOCTYPE HTML> <html> <body> <blockquote cite="http://en.wikipedia.org/wiki/Cascading_Style_Sheets"> Cascading Style Sheets (CSS) is a style sheet language used for describing the look and formatting of a document written in a markup language. </blockquote> </body> </html>
例子
q 元素表示从另一个来源引用的内容。
q 元素的样式约定是以使用引号将引用的文本括起来。
以下代码使用 q 元素。
<!DOCTYPE HTML> <html> <body> <p> <q cite="http://en.wikipedia.org/wiki/Cascading_Style_Sheets"> The <dfn title="Cascading Style Sheets">CSS</dfn> is a style sheet language used for describing the look and formatting of a document written in a markup language. </q> </p> </body> </html>
← 没有了