当前位置: 首页 > 网络学院 > 网页制作基础教程 > HTML > HTML 基本标签
The most important tags in HTML are tags that define headings, paragraphs and line breaks.
HTML中最重要的标签是那些定义标题,段落,转行的标签。
The best way to learn HTML is to work with examples. We have created a very nice HTML editor for you. With this editor, you can edit the HTML source code if you like, and click on a test button to view the result.
学习HTML最好的方法是通过实例练习。W3S打造了一个非常出色的HTML编辑器。 使用这个编辑器,可以随意地编辑你的HTML代码,然后点击按钮去查看它的显示结果。
A very simple HTML document
简单的HTML文档
This example is a very simple HTML document, with only a minimum of HTML tags. It demonstrates how the text inside a body element is displayed in the browser.
这是个非常简单的HTML文档举例,只使用了少量的HTML标签。它所要演示的是浏览器中在body元素中的文字是怎样显现的。
Simple paragraphs
简单的段落
This example demonstrates how the text inside paragraph elements is displayed in the browser.
这个举例所演示的是浏览器中在段落元素中的文字是怎样显现的。
Headings are defined with the <h1> to <h6> tags. <h1> defines the largest heading. <h6> defines the smallest heading.
标题标签被定义在<h1> 到 <h6>这个范围内。<h1> 为最大的标题,<h6> 为最小的。
<h1>This is a heading</h1> |
HTML automatically adds an extra blank line before and after a heading.
HTML会给标题上下自动加上额外的空行。
Paragraphs are defined with the <p> tag.
用<p>标签定义段落。
<p>This is a paragraph</p> |
HTML automatically adds an extra blank line before and after a paragraph.
HTML会给段落上下加上额外的空行。
The <br> tag is used when you want to end a line, but don't want to start a new paragraph. The <br> tag forces a line break wherever you place it.
当你只是想换行,而非从新开始一个段落的话,那可以使用<br>标签。 <br>放在任意一行中都会使它换行。
<p>This <br> is a para<br>graph with line breaks</p> |
The <br> tag is an empty tag. It has no closing tag.
<br>标签是空标签。它没有闭合标签。
The comment tag is used to insert a comment in the HTML source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date.
注释标签通常是插入HTML源码中的。 注释会被浏览器所忽视。你可以用注释来解释你的代码,这样对你将来重新编辑这些代码会带来帮助。
<!-- This is a comment --> |
Note that you need an exclamation point after the opening bracket, but not before the closing bracket.
要注意感叹号是写在前尖括号之后,而非后尖括号之前。
When you write HTML text, you can never be sure how the text is displayed in another browser. Some people have large computer displays, some have small. The text will be reformatted every time the user resizes his window. Never try to format the text in your editor by adding empty lines and spaces to the text.
当你写HTML文档的时候,一般不能肯定这个文档在每个不同浏览器中显示的样子。因为一些人使用大屏幕的显示器, 一些就小些。文档随着窗口的变化而变化。不要尝试在编辑器中使用空行或者空格来格式化你的文档。
HTML will truncate the spaces in your text. Any number of spaces count as one. Some extra information: In HTML a new line counts as one space.
HTML会把文档中那些空开的地方截掉。再多的空格也只会以一个空格的效果来显示。 额外的信息:在HTML中每一行可以想象成是一个单独的空间。
Using empty paragraphs <p> to insert blank lines is a bad habit. Use the <br> tag instead. (But don't use the <br> tag to create lists. Wait until you have learned about HTML lists.)
使用<p>插入空行是个不太好的习惯。请使用 <br>标签来代替。(但别用<br> 来进行创建列表。后面我们会学到如何来创建列表。)
You might have noticed that paragraphs can be written without the closing tag </p>. Don't rely on it. The next version of HTML will not allow you to skip ANY closing tags.
你可能会注意到那些段落可以编辑成没有关闭标签</p>的形式。这并不可取。下个版本的HTML就不允许你忽略任何关闭标签
HTML automatically adds an extra blank line before and after some elements, like before and after a paragraph, and before and after a heading.
HTML会前后给一些元素自动添加额外的空行,像段落和标题。
We use a horizontal rule (the <hr> tag), to separate the sections in our tutorials.
我们使用一个水平线( <hr>标签 ),来划分我们教材的每个部分(我这里把<hr />给隐藏掉了)。
More paragraphs
多段落
This example demonstrates some of the default behaviors of paragraph elements.
多个默认段落元素在文档中的演示
Line breaks
换行
This example demonstrates the use of line breaks in an HTML document.
在HTML文档中使用换行
Poem problems
格式问题
This example demonstrates some problems with HTML formatting.
一些HTML格式上的问题
Headings
标题
This example demonstrates the tags that display headings in an HTML document.
在 HTML文档中使用标题标签
Center aligned heading
标题居中
This example demonstrates a center aligned heading.
让标题居中显示
Horizontal rule
水平分隔线
This example demonstrates how to insert a horizontal rule.
插入水平分割线
Hidden comments
隐藏注释
This example demonstrates how to insert a hidden comment in the HTML source code.
给HTML源代码加入一条隐藏的注释
Background color
背景颜色
This example demonstrates adding a background-color to an HTML page.
为HTML页面加上背景色
Tag | Description |
Defines an HTML document | |
Defines the document's body | |
Defines header 1 to header 6 | |
Defines a paragraph | |
Inserts a single line break | |
Defines a horizontal rule | |
Defines a comment |