HTML标签

Posted 2020-08-06

1、标题标签<h1>~<h6>

编写正文文档，可能需要一段文字作为标题，html包含6个正文标题元素，默认情况下，以较大的粗体显示，可以与正文内容区别开来。

其中h1表示最重要的标题，后面的标题字体一次减小

<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>

2、段落标签<p></p>

标签内的内容被换行，并且也上下内容之间有一行空白

<p>你好</p>
<p>世界</p>

3、引用文本<blockquote>

在正文中如果需要引用其他文本或者添加一段注释，我们需要使用blockquote元素界定一个文本
*blockquote会将段落缩进，会与周围的文字偏离

4、预编排文本<pre>

在HTML文档中保持原来的格式，完全按照“源文件”的格式编排

<pre>
3
+5
------
8
</pre>

5、分区块文本<div>

标签定义 HTML 文档中的一个分隔区块或者一个区域部分

<div>标签常用于组合块级元素，以便通过 CSS 来对这些元素进行格式化

6、跨越多个字符<span>

在正文段落中，对部分字符或词进行格式化

<p>大家好，我喜欢打<span style="color:red;font-weight:bold">篮球</span></p>

7、超链接<a>

用于创建超级链接，它是可以到另一个文档或文件(图形，音频，视频)甚至到同一文档的另一部分的链接。

语法形式：<a href=”目标地址”>描述文本</a>

其中，href用来指定要链接的地址，链接的热点文本。

网页中连接分为两个部分：1、创建锚点

                                  2、指向锚点

例:<a href=” ”name=”zhuang”>描述文本</a>  //创建锚点

      <a href=”#zhuang”>描述类型</a>  //指向锚点

8、图形标签<img>

图像只有（GIF）和JPG文件两种

插入格式为<img src=”../image/图片的名称” alt=”图片名”>

src  图片地址

 alt  图片找不到时要替换的文字

9、框架结构（iframe）

元素会创建包含另外一个文档的内联框架（即行内框架）

1、给框架命名

<iframe src=”” frameborder=”1”  name=”命名” style=””><iframe>

2、设置链接

<a href=”已有的HTML内容” target=”与name命名需一致”>转链接的名字</a>

10、表格标签<table>

在HTML中，表格使用<table>定义，<td>标记分成行，每行的单元格用<td>标记，为了方便记忆可将表格主要分为<thead>页眉，<tbody>主题内容，<tfoot>页脚

<table border=”1” align=“center”>//显示表格，表格向中央移动

<caption>标题</caption>//表格的大标题

<thead>

<tr>

<th>标题1</th>

<th>标题1</th>

</tr>

</thead>

<tbody>

<tr>

<td>数据单元格</td>

<td>数据单元格</td>

</tr>

</tbody>

<tfoot>

<tr>

<td>数据</td>

<td>数据</td>

</tr>

</tfoot>

</table>

11、列表标签

n  有序列表：（用元素ol定义）

<ol>

<li></li>

</ol>

编译后的代码在浏览器显示为有序的文本

        1、编写HTML文件

        2、编写JSP文本

*编号1、2等可以自行换成I、II等其他形式

n  无序列表（ul）

<ul>

<ol></ol>

</ul>

编译后的代码在浏览器显示为有序的文本

      编写JSP文本

     编写HTML文本

*前面的方块可以自行换成五角星、三角等其他形式

自定义列表（dl）

自定义列表由两个元素dt和dd构成，其中dt用于定义列表项的名称，dd用于定义列表项的具体内容

*dt与dd属于同一级别，不是包含

<dl>

    <dt>手机</dt>

    <dd>打电话</dd>

 12、特殊字符

&nbsp    空格

&lt       <

&gt      >

&copy   版权符号

&reg     已注册符号

&amp   and符号&

&#151   ——长破折号