HTML基础标签详解-优快云博客

本文详细介绍了HTML中的基础标签，包括head标签内的各种元信息标签、段落与文字相关的标签等，并解释了它们的作用及使用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Ⅰ.head标签

一般来说，只有6个标签能放在<head>标签内：

1 <title>；

2 <meta>；

①<meta>标签提供的信息不显示在页面中，一般用来定义页面的关键字、页面的描述等，以方便搜索引擎蜘蛛（如百度蜘蛛、谷歌蜘蛛）来搜索到你这个页面的信息。

例子

该标签有很多属性：例子中有提示。

<head>    
    <!--网页关键字-->
    <meta  name="keywords" content="绿叶学习网">
    <!--网页描述-->
    <meta  name="description" content="绿叶学习网是一个富有活力的技术学习网站">
    <!--本页作者-->
    <meta  name="author" content="helicopter">
    <!--页面制作的软件-->
    <meta  name="copyright" content="本站所有教程均为原创，版权所有，禁止转载。否则将追究法律责任。">
    </head>

②meta标签http-equiv属性作用：

定义页面所使用的语言

例子：

<head>
       <meta  http-equiv="content-type" content="text/html; charset=gb2312"/>
       </head>

实现页面的自动刷新跳转

例子：

<head>
    <meta  http-equiv="refresh" content="6;url=http:/www.baidu.com"/>
</head>

3 <link>；

<head>标签内的<link>标签用于外部文件的链接，一般用于链接外部CSS样式表文件和JS文件。

例子：

<head>
    <link  rel="stylesheet"  type="text/css"  title="temp"  href="/temp.css/">
</head>

4 <style>；

<head>标签内的<style>标签用于定义元素的CSS样式。

例子：

<head>
    <style type="text/css">
        div
        {
            font-size:14px;
            color:red;
            border:1px solid gray;
        }
    </style>
</head>

5 <script>；

<head>标签内的<script>标签用于定义页面的脚本，引入外部JS文件。

6 <base>；

用的比较少，标签为整个页面定义所有链接的基础定位

Ⅱ.段落与文字

1.标题标签

<h1>~~~<h6> h1只能有一个

2.段落标签

段落标签：<p></p>

3.文本标签

4.换行标签

换行标签：<br/>

5.水平线标签

6.特殊符号

7.<div>标签

例子：

8.特殊字符：

9.自闭和标签

常见的自闭和标签

①、<meta/>
说明：定义页面的说明信息，供搜索引擎查看。
②、<link/>
说明：用于连接外部的CSS文件或脚本文件。
③、<base/>
说明：定义页面所有链接的基础定位。
④、<br/>
说明：用于换行。
⑤、<hr/>
说明：水平线。
⑥、<input/>
说明：用于定义表单元素
⑦、<img/>
说明：图像标签。

10. 块元素和行内元素

块元素特点：
（1）独占一行，排斥其他元素跟其位于同一行，包括块元素和行内元素；
（2）块元素内部可以容纳其他块元素或行元素；

行内元素特点：
（1）可以与其他行内元素位于同一行；
（2）行内内部可以容纳其他行内元素，但不可以容纳块元素，不然会出现无法预知的效果；

参考文献:http://www.lvyestudy.com/