HTML常用标签介绍back

发布于 2021-03-10  142 次阅读  共 1169 字


标题标签

#入门基础篇 中已经见识过了,HTML 中用 h1~6 表示(双标签)

段落标签

p [paragraph] 标签表示独占一行,(双标签)

<p> </p>

分割线标签

hr [horizontal] (单标签)

<hr />

换行标签

br [break](单标签)

<br />

div 和 span 标签

div span 是没有语义的,是网页布局主要的 2 个盒子
div 就是 division 的缩写分割,分区的意思。

span 跨度,跨距;范围

两个都是双标签

<div>  </div>    <span></span>

区别

  • div 标签 用来布局的,但是现在一行只能放一个 div
  • span 标签 用来布局的,一行上可以放好多个 span

小结

标签名定义说明
<hx></hx>标题标签作为标题使用,并且依据重要性递减
<p></p>段落标签可以把 HTML 文档分割为若干段落
<hr />水平线标签就是一条线
<br />换行标签强制换行
<div></div>div 标签用来布局的,但是现在一行只能放一个 div
<span></span>span 标签用来布局的,一行上可以放好多个 span

标签属性

标签属性就是外在特性

  • 水平线的长度是 200
  • 图片的宽度 是 300

使用 HTML 制作网页时,如果想让 HTML 标签提供更多的信息,可以使用 HTML 标签的属性加以设置。其基本语法格式如下:

<标签名 属性1="属性值1" 属性2="属性值2" …> 内容 </标签名>

图像标签

<img src="url" >

注意:

  1. 标签可以拥有多个属性,必须写在开始标签中,位于标签名后面。
  2. 属性之间不分先后顺序,标签名与属性、属性与属性之间均以空格分开。
  3. 采取 键值对 的格式 key="value" 的格式
  4. 图像标签中 src 属性必须写
  5. alt 属性表示图片未能正常显示时的文本,title 表示图片描述

链接标签

<a href="url" target="_blank"> </a>

注意:

  1. 内部链接 直接链接内部页面名称即可 比如 < a href="index.html"> 首页 </a >
  2. 如果当时没有确定链接目标时,通常将链接标签的 href 属性值定义为 “#”(即href="#"),表示该链接暂时为一个空链接。
  3. 不仅可以创建文本超链接,在网页中各种网页元素,如图像、表格、音频、视频等都可以添加超链接。

关于a标签中的 target 属性的内容

_blank在新窗口中打开被链接文档。
_self在被点击时的同一框架中打开被链接文档(默认)。
_parent在父框架中打开被链接文档。
_top在窗口主体中打开被链接文档。

注释标签

注释内容不会显示在浏览器窗口中,但是作为 HTML 文档内容的一部分,也会被下载到用户的计算机上,查看源代码时就可以看到。

快捷键是: Ctrl+ /

<!-- 注释语句 -->

一般用于简单的描述,如某些状态描述、属性描述等

注释内容前后各一个空格字符,注释位于要注释代码的上面,单独占一行