css - 链接图片下方的多出的边(横线)如何消除?
PHPz
PHPz 2017-04-17 13:03:46
0
9
645
PHPz
PHPz

学习是最好的投资!

全部回复(9)
伊谢尔伦

img{display: block;}

正如前面的朋友所说,img是inline元素,把img转换为block块元素就可以了

大家讲道理

img 属于行内元素,具有:

    display: inline;

与文本相似,基线并不是在容器底部,设置下display或者font-size属性可以消除

header > a > img {
    display: inline-block;
    font-size: 0;
}

改变其父元素 a 的行高line-height也可

header > a {
    line-height: 0;
}
洪涛

不是border:none?

洪涛

我擦,难道不是text-decoration:none;?

巴扎黑

设置链接a的样式?

刘奇
a {
    text-decoration: none;
}

http://www.w3schools.com/css/css_link.asp
http://www.w3schools.com/css/tryit.asp?filename=trycss_link_decoration

迷茫

一般直接显示图片不会出现下划线。导致出现下划线是因为你在图片外套了a标签导致的,你可以在css中写
a{
text-decoration:none;
}
来消除a标签的下划线

Peter_Zhu

加个CSS reset试试?

Ty80

其实我想问下为什么要在*{padding:0; margin:0; background-color: #ccc;}这里的background-color设置的话,其他任何标签都会受到影响吧。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!