`
izuoyan
  • 浏览: 9219991 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

HTML系列之三-基本标签

阅读更多
HTML基本标签


HTML中最重要的标签是定义标题元素,段落和换行的标签。

学习HTML的最好方法是编辑运行示例代码。我们为您创建了一个十分方便的HTML编辑器。在这个编辑器里,您可以编辑HTML源代码,按下“运行代码”按钮后,就可以看见结果。



请自己尝试一下这个例子

一个非常简单的HTML文档:


这个例子是一个非常简单的HTML文档,拥有很少的几个HTML标签。它说明了一个主体元素中的文本是如何在浏览器中显示的。


简单的段落:


这个例子说明了段落元素中的文本是如何在浏览器中显示的。


在这个页面的底部,还有更多例子。



标题元素

标题元素由标签<h1>到<h6>定义。<h1>定义了最大的标题元素,<h6>定义了最小的。

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>

HTML自动在一个标题元素前后各添加一个空行。


段落

段落是用<p>标签定义的。

<p>This is another paragraph</p>

HTML自动在一个段落前后各添加一个空行。



换行

当需要结束一行,并且不想开始新段落时,使用<br>标签。<br>标签不管放在什么位置,都能够强制换行。

<p>This <br> is a para<br>graph with line breaks</p>

<br>标签是一个空标签,它没有结束标记。



HTML中的注释

注释标签用来在HTML源文件中插入注释。注释会被浏览器忽略。你可以使用注释来解释你的代码,这可以在你以后编辑代码的时候帮助你。

<!-- This is a comment -->

注意:你需要在左括号“<”后面跟一个感叹号,右括号不用。



基本注意点——有用的技巧

当你写下HTML文本的时候,你不能确知在另外一个浏览器中,这些文本将被如何显示。有人用着大的显示器,有的人用的小一些。每次用户调整窗口大小的时候,文本都将被重新格式化。不要想在编辑器中写一些空行和空格来协助排版。

HTML将截掉你文本中的多余空格。不管多少个空格,处理起来只当一个。一点附加信息:在HTML里面,一个空行也只被当作一个空格来处理。

使用空段落<p>来插入空白行是一个坏习惯,请使用<br>标签来替代。(但是不要用<br>标签来创建列表,我们后面会专门学习HTML列表的。)

你也许注意到了段落可以不写结束标记</p>。别依赖它,HTML的下一个版本将不准你漏掉任何一个结束标签。

HTML自动在某些元素前后增加额外的空行,就像在段落和标题元素的前后一样。

我们使用了水平线(<hr>标签)来分隔我们教程的章节。



更多示例:

多个段落:


这个例子说明了段落的一些默认行为。


换行:


这个例子说明了在HTML文档中换行的使用。


诗歌的问题:


这个例子说明了HTML显示格式的一些问题。


标题元素:


这个例子说明了在HTML中显示标题元素的标签。


居中的标题元素:


这个例子显示了一个居中的标题元素。


水平线:


这个例子说明了如何插入水平线。


隐藏的注释:


这个例子说明了在HTML文档中如何插入隐藏的注释。


背景色:


这个例子说明了如何给页面设置背景色。

分享到:
评论

相关推荐

    Struts标签- HTML标签

    Struts的HTML标签库是基于JSP标准标签库(JSTL)的,它们扩展了基本的HTML元素,增加了服务器端的功能。这些标签能够直接与Struts ActionForm对象交互,处理用户输入、验证数据以及设置和获取表单字段值。 2. **...

    网页制作大全-html标签大全

    HTML(HyperText Markup Language)是用于创建网页的标准标记语言,它是网页制作的基础,通过一系列的标签来构建网页的结构和内容。本篇文章将全面解析HTML标签,并深入探讨其在网页制作中的应用。 一、HTML基本...

    jQuery---标签式导航菜单.

    构建一个基本的标签式导航菜单的HTML结构至关重要。通常,我们会使用`&lt;ul&gt;`和`&lt;li&gt;`元素来组织菜单项: ```html &lt;ul id="tag-nav"&gt; &lt;li&gt;&lt;a href="#"&gt;标签1&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;标签2&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href...

    struts2-4标签库文件上传下载

    Struts2标签库的强大之处在于它能够方便地集成到现有的项目中,并提供一系列高度定制化的选项,使得开发者能够轻松地构建出功能强大且美观的用户界面。其中,文件上传和下载功能是Struts2标签库的一个亮点,不仅易于...

    JSTL详解--标签库介绍.doc

    #### 三、Core标签库详解 Core标签库是JSTL中最基础也是最常用的一部分,它封装了一系列JSP页面的一般处理功能,共包含14个标签,分为四大类: 1. **多用途核心标签**:包括`&lt;c:out&gt;`、`&lt;c:set&gt;`、`&lt;c:remove&gt;`和`...

    HTML基本标签详细介绍PDF

    HTML(HyperText Markup Language)是构建网页的基础,它使用一系列标签来定义页面的结构和内容。在HTML中,标签是核心元素,它们以尖括号包围,如`&lt;tag&gt;`和`&lt;/tag&gt;`,用于表明元素的开始和结束。本文将深入探讨一些...

    HTML常用标签和属性PPT

    HTML(HyperText Markup Language)是构建网页的基础语言,它通过一系列的标签和属性来描述页面结构和内容。这篇PPT "HTML常用标签和属性" 是为初学者设计的,旨在帮助他们快速掌握HTML的核心概念。 1. HTML标签: ...

    某马机构----HTML常用标签.rar

    HTML(HyperText Markup Language)是构建网页的基础语言,它通过一系列的标签来描述网页的结构和内容。在“某马机构----HTML常用标签.rar”这个压缩包中,我们可以期待找到关于HTML常用标签的学习资料,这对于那些...

    html本书的标签-自己整理

    它通过一系列预定义的标签来定义文档的结构和外观。 - **文档结构**:HTML 文件以 `.html` 结尾,结构通常如下: ```html &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;meta charset="UTF-8"&gt; 网页标题 &lt;!-- 内容 --&gt; &lt;/...

    爱码哥平台:原生控件-label标签

    在爱码哥平台中,`label`标签作为一种基本的原生控件,主要用于显示静态文本内容。它不仅能够简单地展示文本信息,还支持一系列自定义样式设置,如字体大小、颜色、对齐方式等,从而帮助开发者根据需求定制化界面。 ...

    《HTML教程》----------------------

    #### 三、HTML基本标签 **5.1 段落** - `&lt;p&gt;`: 用于定义段落。 **5.2 标题元素** - `&lt;h1&gt;`至`&lt;h6&gt;`: 分别表示一级至六级标题。 **5.3 换行** - ` `: 插入换行符。 **5.4 水平线** - `&lt;hr&gt;`: 插入一条水平...

    python自学教程-09-常见的html标签.ev4.rar

    HTML由一系列元素组成,每个元素都用一对标签表示,如`&lt;p&gt;`和`&lt;/p&gt;`代表段落。元素可以包含文本、其他元素,或者两者都有。标签通常分为开始标签、结束标签和自闭合标签,如`&lt;img&gt;`。 2. 常见的HTML结构标签 - `...

    HTML的简介及标签的使用

    ### HTML的简介及标签的使用 #### 一、HTML简介 HTML,即HyperText ...通过以上介绍,我们对HTML的基本标签有了初步的认识。HTML标签是构建网页的基础,熟练掌握它们可以帮助开发者更高效地创建和维护网页内容。

    HTML5系列教程-HTML5框架、背景和实体

    - 先从HTML5的基本语法和新特性入手,如新标签、表单控件、多媒体支持等。 - 掌握至少一个HTML5框架,理解其工作原理和应用场景。 - 学习如何利用Canvas或SVG创建动态图形,了解WebGL基本概念。 - 实践使用离线...

    HTML(HyperText Mark-up Language)即超文本标记语言

    #### 三、HTML常用标签详解 - **标题标签** (`&lt;h1&gt;` 至 `&lt;h6&gt;`): 这些标签用于定义不同级别的标题,`&lt;h1&gt;` 代表最重要的标题,而 `&lt;h6&gt;` 代表较次要的标题。 - 示例: ```html 主标题 副标题 ``` - **段落标签...

    HTML标签说明

    ### HTML标签说明 #### &lt;!----&gt; - **标签**: `&lt;!----&gt;` - **描述**: 定义HTML文档中的注释。 - **应用场景**: 当你需要在HTML文档中添加一些不会显示在浏览器中的注释时,可以使用这个标签。 #### &lt;!DOCTYPE&gt; - **...

Global site tag (gtag.js) - Google Analytics