HTML 链接 图片引入

文章目录

      • 链接
      • 图片引入

链接

准备工作

新建一个名为link.html和suc.html

在这里插入图片描述

suc.html

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8">
		<title>显示结果</title>
	</head>
	<body>
		注册成功...
	</body>
</html>

link.html

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8">
		<title>链接</title>
	</head>
	<body>	
		<a href="suc.html">我是一个链接</a>
<!--		<a href="./suc.html" target="_blank">我是一个链接(相对路径)</a>-->

</html>

参数介绍

  • a:表示一个链接
  • href: 必填属性表示链接提交到的目的地 后面可以书写相对路径或者绝对路径。
    • 链接默认样式为蓝色,自带下划线如果目的地没有准备好,则可以书写 # 替代
    • ./:表示在当前路径下寻找
  • target: 默认为_self,目标页面取代当前页面更改为_blank,则目标页面与当前页面同时保留-

绝对路径与相当路径

相对路径:不以/开头的路径都称之为相对路径 绝对路径:以/开头的路径都称之为绝对路径
注意:绝对路径一般使用较少,并且极少使用带盘符的书写方式

运行效果

在这里插入图片描述
点击链接跳转到注册成功页面

在这里插入图片描述

图片引入

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8">
		<title>图片引入</title>
	</head>
	<body>
		<img src="./image/etoak.jpg" alt="载入失败" title="庚子年没好事" width="300px">
	</body>
</html>

参数介绍

  • img:引入一张视图
  • src:source的简写,表示源,用来设置引入图片的路径 支持相对和绝对路径
  • alt:当图片载入失败时显示的信息
  • title:光标悬停在此图片上时显示的信息
  • width:设置宽度
  • height:设置高度

注意:width、height两个属性已经被css取代不再推荐使用

运行效果

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/314941.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

[AutoSar]基础部分 RTE 08 runnable mapping

目录 关键词平台说明一、runnable mapping的必要性二、runnable mapping 通用规则三、Task type四、可以不用mapping的runnbale 关键词 嵌入式、C语言、autosar、runnable 平台说明 项目ValueOSautosar OSautosar厂商vector芯片厂商TI编程语言C&#xff0c;C编译器HighTec (…

chat-plus部署指南

目录 1.下载代码 2.启动 3.测试 1.下载代码 cd /optwget https://github.com/yangjian102621/chatgpt-plus/archive/refs/tags/v3.2.4.1.tar.gz 2.启动 cd /opt/chatgpt-plus-3.2.4.1/deploydocker-compose up -d 3.测试 管理员地址xxx:8080/admin 账号密码admin/admin1…

【回顾2023,展望2024】砥砺前行

2023年总结 转眼间&#xff0c;迎来了新的一年2024年&#xff0c;回顾2023&#xff0c;对于我来说是一个充满平凡但又充实又幸运的一年。这一年经历了很多的事情&#xff0c;包括博客创作、技术学习、出书、买房等&#xff0c;基本上每件事情都是一个前所未有的挑战和机遇、使…

Java 设计模式

1.单例设计模式 对某个类只能存在一个对象实例&#xff0c;并且该类只提供一个取得其对象实例的方法。 1.1 饿汉式 构造器私有化 --> 防止直接new类的内部创建对象提供一个static的public方法 getInstance class GirlFriend {private String name;private static GirlFri…

共融共生:智慧城市与智慧乡村的协调发展之路

随着科技的飞速发展和全球化的不断深入&#xff0c;智慧城市和智慧乡村作为现代社会发展的重要组成部分&#xff0c;正逐渐成为人们关注的焦点。然而&#xff0c;在追求经济发展的过程中&#xff0c;城乡发展不平衡的问题也日益凸显。因此&#xff0c;如何实现智慧城市与智慧乡…

HTTP 常见协议:选择正确的协议,提升用户体验(上)

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

MES系统中的设备管理及设备数据采集

随时工厂数字化建设的大力推进&#xff0c;设备管理的效率得到了很大的提升&#xff0c;特别是作为机加工企业&#xff0c;设备是整个企业非常重要的核心资产。 一、设备进行数据采集面临痛点&#xff1a; 设备数据状况无法获取与掌握 设备老旧&#xff0c;信息化基础差&…

【Unity】Attribute meta-data#com.google.android.play.billingclient.version 多版本库冲突

文章目录 一、背景二、问题描述三、解决方案 一、背景 1、Unity 2021.3.9f1 2、Max由6.0.1至最新版本6.1.0 二、问题描述 错误信息 Attribute meta-data#com.google.android.play.billingclient.versionvalue value(6.1.0) from [com.android.billingclient:billing:6.1.0] An…

docker搭建部署minio 存储文件

1. 介绍 MinIO是一个开源的对象存储服务器&#xff0c;它允许你在自己的硬件上构建高性能的对象存储。本文将指导你如何使用Docker搭建和部署MinIO&#xff0c;并挂载外部目录以实现文件的持久化存储。 2. 安装Docker 首先&#xff0c;确保你的系统上已经安装了Docker。你可…

搞定 Postman 接口自动化测试,看这篇文章就够了!

postman 本文适合已经掌握Postman基本用法的读者&#xff0c;即对接口相关概念有一定了解、已经会使用Postman进行模拟请求等基本操作。 工作环境与版本&#xff1a; Window 7&#xff08;64位&#xff09; Postman &#xff08;Chrome App v5.5.3&#xff09; P.S. 不同版…

添加 常用校验方法,校验常见数据格式

目录 一、前置说明1、总体目录2、相关回顾3、本节目标 二、操作步骤1、项目目录2、代码实现3、测试代码4、日志输出 三、后置说明1、要点小结2、下节准备 一、前置说明 1、总体目录 《 pyparamvalidate 参数校验器&#xff0c;从编码到发布全过程》 2、相关回顾 基于 Valid…

Tomcat基础升华学习

01 What is Tomcat 1.1 Tomcat官网 官网 &#xff1a;https://tomcat.apache.org 1.2 Understand 为什么说Tomcat是Servlet之类技术的实现&#xff1f; 在我们的理解中&#xff0c;Tomcat可以称为Web容器或者Servlet容器 不妨通过手写一个Tomcat来推导一下 1.2.1 创建Tomc…

从Scroll怒喷社区用户事件,看L2龙头ZKFair的做事格局

这两天&#xff0c;随着美国SEC正式批准所有11只比特币现货ETF的消息公布&#xff0c;吸引了传统主流增量资金的入场&#xff0c;比特币多头一举将比特币干到了48000刀的位置&#xff0c;并随时向着前高发起了冲击。比特币的强势带动了其他加密资产的保障&#xff0c;整个加密市…

【计算机毕业设计】基于springboot的校园跑腿任务管理系统java+vue

校园跑腿管理系统又称“效率鸭”跑腿系统&#xff0c;是在学校进行现代化的信息管理和提供信息服务的基础&#xff0c;引导人们快速、准确地获取快递资源、预约洗浴并对外卖资源进行有效管理的保证。疫情当下&#xff0c;为了减少人员的聚集&#xff0c;因此&#xff0c;迫切需…

家用洗地机哪个品牌质量比较好?高配置洗地机推荐

近年来&#xff0c;科技飞速发展&#xff0c;推动了多个新兴行业的崛起&#xff0c;其中洗地机行业也在不断扩大。然而&#xff0c;随着市场的蓬勃发展&#xff0c;洗地机市场的产品质量参差不齐。在众多品牌中&#xff0c;真正致力于深入研究和创新的品牌相对较少。洗地机的问…

js封装根据年月日获取星座效果demo(整理)

//根据年月日获取星座 function getZodiacSign(dateString) {// 用法:const dateStr 2024-01-11;// const zodiacSign getZodiacSign(dateStr);const date new Date(dateString);const month date.getMonth() 1;const day date.getDate();if ((month 1 && day &…

32个图片素材库网站,有些直接免费商用!

划到最后“阅读原文”——领取工具包&#xff08;超过1000工具&#xff0c;免费素材网站分享和行业报告&#xff09; Hi&#xff0c;我是胡猛夫~&#xff0c;专注于分享各类价值网站、高效工具&#xff01; 更多内容&#xff0c;更多资源&#xff0c;欢迎交流&#xff01; 公 …

揭秘HTTP协议:深入了解互联网通信的核心!

文章目录 HTTPHTTP的消息结构HTTP 常用请求方法HTTP 状态码 HTTP HTTP 是超文本传输协议&#xff0c;HTTP是缩写&#xff0c;全称是 HyperText Transfer Protocol 超文本指的是 HTML、css、JavaScript和图片等&#xff0c;HTTP的出现就是为方便接收和发布超HTML页面&#xff0c…

多模态大模型

一、图文匹配 二、Stable-Diffusion(稳定扩散) 图片生成器 Stable-Diffusion(稳定扩散)组成模块: CrossAttention模块:将文本的语义信息与图像的语义信息进行Attention机制&#xff0c;增强输入文本Prompt对生成图片的控制。SelfAttention模块:SelfAttention模块的整体结构与C…

ES分词器

Analysis&#xff1a;文本分析是把全文本转换一系列单词的过程&#xff0c;也叫分词。Analysis是通过Analyzer(分词器)来实现的。 1.Analyzer组成 注意&#xff1a;在ES中默认使用标准分词器&#xff1a;StandardAnalyzer。特点是&#xff1a;中文是单字分词&#xff0c;英文是…