css - 链接图片下方的多出的边（横线）如何消除？

Answer 1

img{display: block;}

As the previous friend said, img is an inline element, just convert img into a block element

Answer 2

img is an inline element and has:

    display: inline;

Similar to text, the baseline is not at the bottom of the container. This can be eliminated by setting the display or font-size attributes

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

You can also change the line-height of its parent element a

header > a {
    line-height: 0;
}

Answer 3

Not border:none?

Answer 4

I wipe it, isn’t it text-decoration:none;?

Answer 5

Set the style of link a?

Answer 6

a {
    text-decoration: none;
}

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

Answer 7

Generally, pictures will be displayed directly without underlining. The underline appears because you wrapped the a tag in the image. You can write
a{
text-decoration:none;
}
in css to eliminate the underline of the a tag

Answer 8

Try adding a CSS reset?

Answer 9

Actually, I want to ask why if you set the background-color here in *{padding:0; margin:0; background-color: #ccc;}, any other tags will be affected.