Heim >Web-Frontend >HTML-Tutorial >关于图片按钮问题_html/css_WEB-ITnose

关于图片按钮问题_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:14:09915Durchsuche

想做最简单的静态图片按钮(就是无论鼠标移不移过去,无论鼠标点不点击,图片都还是那个样子)。在网上看到文章说应该用INPUT来做,但是该文章又说应该用INPUT的SUMIT按钮来做,说比INPUT的IMAGE按钮读取图片速率要快,真的有这样的差别的吗?另外想问的是ASP.NET里面也有个IMAGEBUTTON,用IMAGEBUTTON的话有什么分别?


回复讨论(解决方案)

直接一个关于图片按钮问题_html/css_WEB-ITnose,配上cursor:pointer,搞定。^_^

直接一个关于图片按钮问题_html/css_WEB-ITnose,配上cursor:pointer,搞定。^_^
但是得链接到指定网址啊,比如说点击图片链接到www.163.com,那怎么搞……?

额 光实现功能的话
关于图片按钮问题_html/css_WEB-ITnose
效率就不敢说了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title> <style type="text/css"> *{margin:0;padding:0;} .btn{ height:18px; line-height:18px; padding:5px 10px 0; margin:15px; float:left;display:inline-block; color:#333; font-size:12px; text-decoration:none; background:url(http://image0.139cm.com/rm/richmail/images/mutualBtn.png) 0 -132px repeat-x; position:relative;} .btn{ height:18px; line-height:18px; padding:5px 10px 0; float:left;display:inline-block; font-size:12px; background:url(http://image0.139cm.com/rm/richmail/images/mutualBtn.png) 0 -132px repeat-x;} .btn i{display:inline-block;}.l_border,.r_border{width:3px; height:24px;display:inline-block; background:url(http://image0.139cm.com/rm/richmail/images/mutualBtn.png) no-repeat; position:absolute;} .btn i.l_border{background-position: 0 -26px; left:0; top:0px;} .btn i.r_border{background-position: -3px -26px; right:0px; top:0px;}  </style>    </head> <body>  <a href="#" class="btn"><i class="l_border"></i>删 除<i class="r_border"></i></a><a href="#" class="btn"><i class="l_border"></i>删 除<i class="r_border"></i></a><a href="#" class="btn"><i class="l_border"></i>删 除<i class="r_border"></i></a>  </body></html>


我用a标签模拟了一个自适应的按钮,其实其它效果的都类似~你看看吧

引用 1 楼  的回复:

直接一个关于图片按钮问题_html/css_WEB-ITnose,配上cursor:pointer,搞定。^_^

但是得链接到指定网址啊,比如说点击图片链接到www.163.com,那怎么搞……?
一句脚本就行了。当然也可以用3楼的。

额 光实现功能的话
关于图片按钮问题_html/css_WEB-ITnose
效率就不敢说了
我之前也是这样搞的,可出现一个问题,我想把页面所有链接颜色改成黑色的时候,设置"color:black"。在IE 9下面,图片会给描上一个黑色的框,如果把COLOR改蓝色的话也会描上一个蓝色的框。在CHROME等等却不会这样,郁闷死了。PS:我在A的CSS下也没加过BORDER的设置,很奇怪不知道为啥会有这样的怪效果。

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn