HTML入门5_常用标签_图像标签img和链接标签a_使用超链接插入图片和使用img插入图片有何不同-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_34400745/article/details/110874896

img标签：

img元素向网页中插入图像，并不是插入而是链接图像，标签创建的是被引用的图像的占位空间；
<img>有有两个必需的属性，src属性和alt属性；
语法格式：

<img src="url" alt="some_text">

alt: 规定图像的替代文本
src: 规定显示图像的URL
height :定义图像的高度
width: 设置图像的宽度
举例如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<img src="0911\img.png" alt="背景图片" height="200px" width="400px">
</body>
</html>

长度和宽度属性值默认单位为像素

a标签：

语法为：

<a href="url">链接文本</a>

定义超链接，用于从一张页面链接到另外一张

href属性

最重要的属性是href属性，它指示链接的目标；

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<a href="https://blog.youkuaiyun.com/qq_34400745">点击链接到csdn</a>
</body>
</html>

target 属性

你可以定义被链接的文档在何处显示。
target = "_blank"代表会在新窗口打开，默认在当前窗口打开；

<a href="https://www.baidu.com/" target="_blank" rel="noopener noreferrer">访问菜鸟教程!</a>

rel="noopener noreferrer"意思是不会打开其他的网站，因为恶意病毒可能会修改你的浏览器空白页地址。