前端学习-02-HTML常用标签

4.HTML常用标签

4.1标签语义

指标签的含义，即这个标签是用来干嘛的
根据标签的语义，在合适的地方给一个最为合理的标签，让页面结构更清晰

4.2标题标签

HTML提供6个等级的网页标题，即<h1><h2><h3>.....<h6>

<h1>一级标题</h1>

标签语义：作为标题使用，并依据重要性递减
特点：
a.加了标题的文字会加粗，字号变大
b.一个标题独占一行

4.3段落和换行标签

4.3.1段落标签

<p>标签用于定义段落

<p>段落标签</p>

标签语义：把HTML文档分成了若干段落
特点：
a.文本在一个段落中会根据浏览器窗口大小自动换行
b.段落和段落之间保有空隙

4.3.2换行标签

<br/>标签用于换行
标签语义：强制换行
特点：
a.<br/>是单标签
b.<br/>标签只是简单的开始新的一行，跟段落不一样，段落之间还会插入一些垂直的间距

4.4文本格式化标签

使文本以特殊的方式显示，如粗体、斜体、删除线、下划线
标签语义：突出重要性，比普通文字重要

4.5 div和span标签

<div>和<span>没有语义，它们就是一个盒子，用来装内容。

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

特点：
a.<div>标签用来布局，但一行只能放一个<div>，大盒子。
b.<span>标签用来布局，一行可以有多个<span>，小盒子

4.6图像标签和路径

4.6.1图像标签

在HTML中,<img>标签用于定义HTML页面中的图像
src是<img>标签的必须属性，它用于指定图像文件的路径和文件名

注意：
a.图像标签可以拥有多个属性，必须写在标签名后面
b.属性之间不分先后顺序，标签名与属性、属性与属性之间用空格分开
c.属性采取键值对的格式，即key="value"的格式，属性=“属性值”

4.6.2路径

目录文件夹：就是普通的文件夹，里面存放我们所需的素材，如html文件
根目录：打开目录文件夹的第一层就是根目录
1.相对路径：以引用文件所在位置为参考基础，而建立出的目录路径

2.绝对路径：是指目录下的绝对位置，直接到达目标位置，通常是盘符开始的路径或网络地址

4.7超链接标签

在HTML中，<a>标签用于定义超链接，作用是从一个页面链接到另一个页面

4.7.1链接的语法格式

<a href="跳转目标" target="目标窗口弹出方式">文本或图像</a>

4.7.2链接的分类

a.外部链接
b.内部链接：网站内部网页之间的相互链接，直接链接内部页面名称即可
c.空连接：如果当时没有确定链接目标时，href属性值为#，例如

<a href="#">空链接</a>

d.下载链接：如果href里面地址是一个文件或压缩包，点击链接会下载文件
e.网页元素链接：网页中的各种网页元素，如文本、图像、音视频都可以添加超链接
f.锚点链接：点击链接，可以快速定位到页面中的某个位置
1.在链接文本的href属性中，设置属性值为 #名字 的形式，例如

<a href="#two">第二季</a>

2.找到目标位置标签，在里面添加一个id属性=href属性里面的名字，例如

<h3 id="two">第二季介绍</h3>