• 主页
  • ASP
  • .NET Framework
  • Web Services
  • VB
  • VC
  • 图表区
  • 分析与设计
  • 组件/控件开发
  • LINQ

如何去掉img上的灰色边框?

dog357 2012-08-14 01:32:32
环境:VS2008 asp.net3.5
问题:我的目的是想实现个图标+文字的按钮,图标使用<img>标签,图片是在一张大图片上的一部分18*18,作为背景图。现在问题是不管怎么弄,img上总有个灰色边框去不掉,请问大家有没有什么好的办法啊?

<a href="javascript:void(0);" id="idBoxOK" class="lightboxButton">
<img id="idBoxOKImg"/><span class="lightboxButtonText">确定</span>
</a>

#idBoxOKImg
{
width:18px;
height:18px;
background-image:url(所有图标.gif);
background-repeat: no-repeat;
background-position:-36px 0px;
border-style:none;
padding-left:9px;
}

因为图标是大图的一部分,所以设置src不行,只能设置为背景。在网上找资料说是边框是背景时留下的间隔。不知道该如何去掉?
...全文
26125 点赞 收藏 32
写回复
32 条回复
smallbirdinsky 2014年09月08日
img{
border:none;
}
回复 点赞
凤凰涅槃 2013年12月17日
我这边的img边框一直都去不掉呀。img,table,tr,td{border-style:none;border:none;border-width:0;border-image-width:0;border-bottom-color:transparent} style="border:0"都试过了不行
回复 点赞
amd2008 2012年11月05日
15楼威武
回复 点赞
师太请留步 2012年08月15日
其实不用那么麻烦,你只要写一个display:block就可以了
回复 点赞
孟子E章 2012年08月15日
你的图片显示到背景里面,其他标签都是可以的。

只有src="图片"的时候才使用img。
你对html还 不熟悉啊
回复 点赞
dog357 2012年08月14日
[Quote=引用 22 楼 的回复:]

另外,显示背景,你可以使用其他的标签啊,如div等,为何要使用img啊
[/Quote]

我想显示按钮为 图标+文字 的嘛,就像csdn的发帖按钮。。。。那就是<a> + <img> + <span>了啊。
回复 点赞
dog357 2012年08月14日
非常感谢各位,问题已解决,答案在15楼!!
回复 点赞
孟子E章 2012年08月14日
另外,显示背景,你可以使用其他的标签啊,如div等,为何要使用img啊
回复 点赞
linxiang0507 2012年08月14日
<a href="javascript:void(0);" id="idBoxOK" class="lightboxButton">
<img id="idBoxOKImg" style="border:0"/><span class="lightboxButtonText">确定</span>
style="border:0" 在img标签中加上这个属性就可以了
回复 点赞
aa405511071 2012年08月14日
<a href="InfoCenter/ZhuZuoQuan.aspx" target="_blank" style="border: 0">
<img src="images/qy_zzq.jpg" alt="" style="border: 0" /></a>
回复 点赞
aa405511071 2012年08月14日
<a href="InfoCenter/ZhuZuoQuan.aspx" target="_blank" style="border: 0">
<img src="images/qy_zzq.jpg" alt="" style="border: 0" /></a>
回复 点赞
dog357 2012年08月14日
[Quote=引用 16 楼 的回复:]

另外,不要贴外站不能显示的图片
[/Quote]

图片不能显示么?我都看得到啊。就不知道csdn怎么上传图片,我用的是网易博客上的
回复 点赞
dog357 2012年08月14日
[Quote=引用 15 楼 的回复:]

你的img标签没有设置src,显示的是系统的没有图片的标记,并不是html代码的问题。,你设置一个空白图就可以了
<img id="idBoxOKImg" src="http://www.xcwljy.cn/images/pixel.gif" />
[/Quote]

成功了,非常感谢!
回复 点赞
孟子E章 2012年08月14日
另外,不要贴外站不能显示的图片
回复 点赞
孟子E章 2012年08月14日
你的img标签没有设置src,显示的是系统的没有图片的标记,并不是html代码的问题。,你设置一个空白图就可以了
<img id="idBoxOKImg" src="http://www.xcwljy.cn/images/pixel.gif" />
回复 点赞
dog357 2012年08月14日

如图,确定是没有边框的,而取消图片则有边框,前者是使用src="**gif",后者使用background-image
原图是没有边框的
回复 点赞
蝶恋花雨 2012年08月14日
lightboxFoot border=0
idBoxOKImg border=0
如果相片本身有边框就例外
回复 点赞
dog357 2012年08月14日
[Quote=引用 9 楼 的回复:]

idBoxOKImg设置的是 标签的img的边框,跟src没关系

也可以外面A导致的。没有全部测试代码。无从推断
[/Quote]

如果不用background-image而设置src="",则没有边框;但如果用background-image则边框怎么也去不掉。百度了一下说是边框是背景时留下的间隔,但没有解决方法。不知道该如何去掉?
回复 点赞
紫魂一号 2012年08月14日
[Quote=引用 7 楼 的回复:]
引用 6 楼 的回复:

是不是 background-position:-36px 的原因,调调试试


不是,因为图片背景是透明的,没有问题,图标18*18, background-position:-36px 刚好对齐;
边框是img的边框
[/Quote]

难道你图片本身有边框?
回复 点赞
dog357 2012年08月14日
全部代码如下:

.lightboxFoot
{
height:30px;
line-height:30px; /* line-height = height ,使文本垂直居中 */
width:100%;
background:#E8E8E8;
border-top:1px solid #b9b9b9;
}

.lightboxFoot *
{
vertical-align:middle; /* 使图片垂直居中 */
}

#idBoxOKImg
{
width:18px;
height:18px;
background-image:url(所有图标.gif);
background-repeat: no-repeat;
background-position:-36px 0px; /*取第1行第3列的图标*/
border-style:none;
padding-left:9px;
}


<div id="idBoxFoot" class="lightboxFoot" >
<a href="javascript:void(0);" id="idBoxOK" class="lightboxButton">
<img id="idBoxOKImg"/><span class="lightboxButtonText">确定</span>
</a>
</div>
回复 点赞
发动态
发帖子
.NET技术社区
创建于2007-09-28

4.9w+

社区成员

66.8w+

社区内容

.NET技术交流专区
社区公告
暂无公告