HTML：图片与链接

最新推荐文章于 2024-04-13 18:51:45 发布

Alex_cun

最新推荐文章于 2024-04-13 18:51:45 发布

阅读量421

点赞数

分类专栏：个人笔记

本文链接：https://blog.csdn.net/Alex_cun/article/details/77149904

版权

个人笔记专栏收录该内容

35 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--
目标：1、掌握图片和链接以及常用属性的用法
      2、熟悉相对路径的使用
      ../  向上查找一级
      ../../  向上查找两级

img : 图片
src :图片的相对路径
alt：图片无法正常显示的时候的替换文字
title:鼠标移入图片时显示的提示文字

a:
    1、链接到互联网上的页面
    href：网址
    target="_blank" 在新窗口中打开链接
    2、链接到项目中的其他页面
    href：相对路径
    3、链接到当前页面的指定位置（锚记）

    大于：&gt;&gt;&gt;
    空格：&nbsp;&nbsp;&nbsp;
-->
<h1 id="top">顶部</h1>
<a href="http://www.baidu.com"><img src="image\img.jpg" alt="替换文字" title="提示文字"></a>
<a href="http://www.baidu.com" target="_blank" title="跳转到百度">去百度</a>
<a href="6、蜀道难.html">蜀道难</a>
<p style="height: 500px;background-color: red;"></p>
<p style="height: 500px;background-color: yellow;"></p>
<p style="height: 500px;background-color: blue;"></p>
<p style="height: 500px;background-color: pink;"></p>
<p style="height: 500px;background-color: green;"></p>
<a href="#top">回到顶部</a>
</body>
</html>

Alex_cun

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML：图片与链接

html>html lang="en">head> meta charset="UTF-8"> title>Titletitle>head>body><!--目标：1、掌握图片和链接以及常用属性的用法 2、熟悉相对路径的使用 ../ 向上查找一级 ../../ 向上查找两级img : 图片src :图片的相对路径alt：图
复制链接

扫一扫

专栏目录