咸鱼前端—HTML标签难点整理1

咸鱼前端—HTML标签整理1

• 字符集
• div span标签
• 图像标签img
• 链接标签
• 锚点定位

字符集

<meta charset="UTF-8" />

utf-8是目前最常用的字符集编码方式，常用的字符集编码方式还有gbk和gb2312。

gb2312 简单中文 包括6763个汉字

BIG5 繁体中文 港澳台等用

GBK包含全部中文字符 是GB2312的扩展，加入对繁体字的支持，兼容GB2312

UTF-8则包含全世界所有国家需要用到的字符

一般文件出现乱码，请修改一下字符集

div span标签

div span 是没有语义的 是我们网页布局主要的2个盒子 div+css

div 就是 division 的缩写 分割， 分区的意思 。

span, 跨度，跨距；范围

语法格式：

<div> 我是咸鱼我独占一行 </div>    <span>我是小咸鱼 我可以好多鱼在一行</span>

图像标签img

1. 当.html与图片在一个文件夹下时，直接用图片的名字即可

1. 当img图片文件夹和.html文件位于同一个文件夹下，可用

1. 当img文件夹和.html文件所在的文件在在同一个文件夹中，则需要

1. 网络链接图片

链接标签

单词缩写： anchor 的缩写 。基本解释 锚

在HTML中创建超链接非常简单，只需用标签环绕需要被链接的对象即可，其基本语法格式如下：

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

**href：**用于指定链接目标的url地址，当为标签应用href属性时，它就具有了超链接的功能。 Hypertext Reference的缩写。意思是超文本引用

target：用于指定链接页面的打开方式，其取值有self和blank两种，其中self为默认值，blank为在新窗口中打开方式。

注意：

1.外部链接 需要添加

<a href="www.baidu.com" target="blank">百度链接</a>

2.内部链接 直接链接内部页面名称即可 比如

< a href="index.html"> 首页 </a >

3.如果当时没有确定链接目标时，通常将链接标签的href属性值定义为“#”(即href="#")，表示该链接暂时为一个空链接。

4.不仅可以创建文本超链接，在网页中各种网页元素，如图像、表格、音频、视频等都可以添加超链接。

锚点定位

通过创建锚点链接，用户能够快速定位到目标内容。

创建锚点链接：

使用“a href=”#id名>“链接文本"创建链接文本（被点击的）

<a href="#xianyu">跳转到咸鱼</a>

使用相应的id名标注跳转目标的位置。

<h5 id="xianyu">点击后直接跳到这里</h5>