【HTML】标签下合集~~~
创始人
2024-04-02 21:53:11
0

😊博主页面:鱿年年

👉博主推荐专栏:《WEB前端》👈

​💓博主格言:追风赶月莫停留,平芜尽处是春山❤️


目录

一、图像标签和路径(重点)

1.图像标签

2.路径

二、超链接标签(!!!)

1.超链接的语法格式

2.超链接的分类


一、图像标签和路径(重点)

1.图像标签

2.路径

(1)目录文件夹和根目录:

在实际工作中,我们的文件不能随便乱放,否则用起来很难很快的速度找到他们,因此我们需要一个文件夹来管理他们。

目录文件夹:就是普通文件夹,里面只不过存放了我们做页面所需要的相关素材,比如html文件、图片等。

根目录:打开目录文件夹的第一层就是根目录

(2)Vscode打开目录文件夹:

文件---打开文件夹,选择目录文件夹,后期非常方便管理文件。

 路径

页面中的图片会非常多,通常我们会新建一个文件夹来存放这些图像文件(images),这时再查找图像,就需要采用“路径”的方式来指定图像文件的位置。

路径可以分为:

1.相对路径

2.绝对路径

相对路径:以引用文件所在位置为参考基础,而建立出的目录文件。简单来说,就是图片相对于HTML页面的位置。

相对路径分类符号说明
同一级路径图像文件位于HTML文件同一级 如
下一级路径  /图像文件位于HTML文件下一级 如.
上一级路径  .../图像文件位于HTML文件上一级  如

 同一级路径

 下一级路径

上一级路径 

注意:相对路径是从代码所在的这个文件出发,去寻找目标文件的,而我们这里说的上一级,下一级和同一级就是图片相对于HTML页面的位置。 

绝对路径:是指目录下的绝对位置,直接到达目标位置,通常是从盘符开始的路径。

例如,“D:\web\img\logo.gif”或完整的网络地址“https://www.itcast.cn/images/logo.gif”。

二、超链接标签(!!!)

在HTML标签中,标签用于定义超链接,作用是从一个页面链接到另外一个页面。

1.超链接的语法格式

文本或图像

单词anchor的缩写,意为:锚。

链接中的两个属性作用如下:

属性作用
href用于指定链接目标的URL地址,(必须属性)当为标签应用href属性时,它就具有了超链接的功能。
target用于指定链接页面的打开方式,其中_self为默认值,_blank为在新窗口中打开方式

2.超链接的分类

1.外部链接:例如腾讯



外部链接

1.外部链接

CSDNtarget 打开窗口的方式 默认值是_self 当前窗口打开页面 _blank 新窗口打开页面腾讯

代码实现:

2.内部链接:网站内部页面之间的相互链接,直接链接内部页面名称即可,例如首页

代码实现:



外部链接

1.外部链接

CSDNtarget 打开窗口的方式 默认值是_self 当前窗口打开页面 _blank 新窗口打开页面腾讯

2.内部链接:网站内部页面之间的相互链接

图像标签

3.空链接:如果当时没有确定链接目标时,首页

代码实现:



外部链接

1.外部链接

CSDNtarget 打开窗口的方式 默认值是_self 当前窗口打开页面 _blank 新窗口打开页面腾讯

2.内部链接:网站内部页面之间的相互链接

图像标签

3.空连接:#

地址

4.下载链接:如果href里面地址是一个文件或者压缩包,会下载这个文件。

 代码实现:



外部链接

1.外部链接

CSDNtarget 打开窗口的方式 默认值是_self 当前窗口打开页面 _blank 新窗口打开页面腾讯

2.内部链接:网站内部页面之间的相互链接

图像标签

3.空连接:#

地址

4.下载连接:地址链接的是文件 .exe 或者是 zip 等压缩包形式

下载文件

5.网页元素链接:在网页中的各种网页元素,如文本、图像、表格、音频、视频等都可以添加超链接的。

代码实现:



外部链接

1.外部链接

CSDNtarget 打开窗口的方式 默认值是_self 当前窗口打开页面 _blank 新窗口打开页面腾讯

2.内部链接:网站内部页面之间的相互链接

图像标签

3.空连接:#

地址

4.下载连接:地址链接的是文件 .exe 或者是 zip 等压缩包形式

下载文件

5.网页元素的链接

 赶快学起来吧!!!

相关内容

热门资讯

前端-session、jwt 目录:   (1)session (2&#x...
linux入门---制作进度条 了解缓冲区 我们首先来看看下面的操作: 我们首先创建了一个文件并在这个文件里面添加了...
关于测试,我发现了哪些新大陆 关于测试 平常也只是听说过一些关于测试的术语,但并没有使用过测试工具。偶然看到编程老师...
前缀和与对数器与二分法 1. 前缀和 假设有一个数组,我们想大量频繁的去访问L到R这个区间的和,...
nodejs:本地安装nvm实... 一、背景-使用不同版本node的原因 vue3+ts、nuxt3版本,node...
JAVA集合知识整理 Java集合知识整理 HashMap相关 HashMap的底层数据结构:jdk1.8之...
无刷直流电机介绍及单片机控制实... 无刷直流电机介绍及单片机控制实例前言基本概念优势与劣势使用寿命基本结构使用单片机控制实例电子调速器&...
fwdiary(2) dp2 1.传纸条  AcWing 275. 传纸条 - AcWing 走两条路,走一条最大的...
常用的DOS命令 常用的DOS命令 DOS(Disk Operating System,磁...
<C++> 类和对象(下) 1.const成员函数将const修饰的“成员函数”称之为const成员函数,cons...