1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > HTML:a button input三种标签下的图片按钮

HTML:a button input三种标签下的图片按钮

时间:2019-10-19 02:04:44

相关推荐

HTML:a button input三种标签下的图片按钮

简述:

HTML中以下几种方式可以用来创建一个图片按钮(或是图片超链接):

a标签button标签input标签中的image类型

下面一一示例。

详解:

1、a标签

a标签用于生成超链接,当内嵌img图片标签时,点击对象就是该图片。

点击会跳转到指定链接。

创建格式:

<a href="http:\\" target="_blank"><img src="111.jpg" width="80" alt="百度"></a>

href属性:超链接地址

target属性:新链接打开方式(_blank为新窗口形式)

alt属性:备用信息,当图片丢失时显示该文字

创建结果:

2、button标签

与a标签一样,当内嵌图片标签时,该按钮就是图片按钮。

当不绑定事件时,点击无任何反应。

创建格式:

<button><img src="111.jpg" width="80" alt="图片"></button>

创建结果:

3、input标签

input标签中,当标签类型为image时,就可以产生一个图片按钮。

点击时会在url中反馈像素点坐标。

创建格式:

<form action=""><input type="image" src="111.jpg" alt="图片" width="300"></form>

src:图片链接

width:图片像素宽度(宽度和高度只设定一个的话,HTML会根据比例进行整体图片的放大或缩小)

创建结果:

可以看出,当点击图片时,url中会反馈点击的像素点坐标。

学习整理,若有问题请指出。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。