给图片带上链接的html代码

    时间: 浏览:4471次  来源:站长在线
今天我的一个好多年的建站的老朋友,问我:图片如何做成链接?也就是说:怎样给图片带上链接?天啦,这么简单的问题,他怎么问得出口哦!当然了,我们认为简单要死的问题,也许对别人来说,

今天我的一个好多年的建站的老朋友,问我:图片如何做成链接?

也就是说:怎样给图片带上链接?

天啦,这么简单的问题,他怎么问得出口哦!

当然了,我们认为简单要死的问题,也许对别人来说,还真的不知道呢?既然问我了,我就还是要好好的解答的:

给图片带上链接,很简单,就是一段html代码而已:

<a href="链接网址" target="_blank">
<img alt="图片描述" src="图片地址"  width="图片宽度" height="图片高度" />
</a>

其中,相关参数信息如下:

href="链接网址" :这里是链接地址是任意的链接地址,可以是本站的也可以是外站的。是必选参数。

target="_blank":这个是指在新窗口打开的意思。非必选项,可以去掉这个参数,就是在当前页面打开链接。

alt="图片描述":这个图片描述就是定义图片的名字或者属性,告诉搜索引擎这是一张关于什么的图片,当网速慢,或者图片丢失的时候,会显示这个图片描述的信息。非必选项。

src="图片地址":在网页里面图片的地址,一定是已经存在的地址。必选项。

width="图片宽度":这是定义这张图片的显示宽度。值为数值,单位为px,如400px ,通常只是写400 。也可以写成100%,就是图片的实际大小。也可以不写。

height="图片高度":这是定义这张图片的显示高度。值为数值,单位为px,如400px ,通常只是写400 。也可以写成100%,就是图片的实际高度,大多数情况下可以不写宽带,让这个图片的高度自适应图片的宽度。

根据上面的介绍内容,下面我来实际填写参数,给大家看看:

<a href="https://www.olzz.com/mipdiy.html" target="_blank">
<img alt="自适应MIP建站系统独立mipdiy模板" 
     src="https://www.olzz.com/img/mipdiy.jpg"  width="600" height="375" />
</a>

演示效果:https://www.olzz.com/html/geitupiandaishanglianjiedehtmldaima.html



本文地址:https://www.olzz.com/geitupiandaishanglianjiedehtmldaima.html
码字不易,打个赏呗
杨泽业感谢你的支持!

猜你喜欢

一行HTML代码让网站内的链接全部自动新窗口打开

导读:这是一行可以让你网站内的所有链接,实现全部自动新窗口打开。有需要的同学,自己添加到自己的网站模版里面哦!

2024-07-02  分类:HTML代码  浏览:494次


在HTML网页中,左图片右文字代码

今天一个客户的网站,要求在文章排版中,要求左边是图片,右边是文字的排版,我找了一段代码,测试了一下,没有问题,现在发布出来,供大家参考:

2022-08-19  分类:HTML代码  浏览:4792次


HTML常用英语及用法

站长在线站长,准备系统的学习HTML知识,但是对我来说,英语实在是太差了,当然我知道的是,不仅仅我,很多人在学习HTML的时候,也是不知道这个英语单词的意思与用法的,在这里站长在线站长就把这些英语整理出来,把英语以及中文意思、用法一起贴出来,让大家一起来学习。

2022-01-02  分类:HTML学堂  浏览:1718次


给图片带上链接的html代码

今天我的一个好多年的建站的老朋友,问我:图片如何做成链接?也就是说:怎样给图片带上链接?天啦,这么简单的问题,他怎么问得出口哦!当然了,我们认为简单要死的问题,也许对别人来说,

2021-12-23  分类:HTML代码  浏览:4472次


站长在线HTML5学习笔记:HTML的相关概念详解

导读:欢迎你来到站长在线的站长学堂,学习HTML5的知识,今天分享的是《HTML的相关概念详解》。主要内容有:WWW,W3C,WHATWG,URL,HTTP,XHTML,网站,域名,网站空间,网站程序。

2021-11-27  分类:HTML学堂  浏览:1790次


chm文档怎么转html文档

我们有时候拿到的电子书的格式是chm的,有时候不太方便阅读,我们可以把他转换成html格式的文档进行阅读。 那么怎样才能把chm格式的文档转换成html格式的呢? 其实非常的简单,可以使用Windows自带的命令提示符工具,轻轻松松的完成转换。

2021-11-10  分类:电脑知识  浏览:2981次


零基础HTML5从入门到精通学习笔记汇总

导读:大家好,欢迎你来到站长在线的站长学堂,学习HTML知识,本站整理的《零基础HTML从入门到精通学习笔记》详细教程以最新版的HTML5为基础。

2021-11-10  分类:HTML学堂  浏览:1527次