[分享]css去除图像3px

在开发网站时，常常会遇到图像间距与布局的问题。特别是CSS布局时，多少会遇到一个距离问题，往往这个距离仅有3个像素，却不可忽视，这就是所谓的“3像素问题”。这个问题源自于标记是行内元素，而行内元素会在...

在开发网站时，常常会遇到图像间距与布局的问题。特别是CSS布局时，多少会遇到一个距离问题，往往这个距离仅有3个像素，却不可忽视，这就是所谓的“3像素问题”。

这个问题源自于标记是行内元素，而行内元素会在内容周围留下一些间距，而这个间距没有办法在CSS样式中引用。

 img {
        display: block;
        margin: 0;
        border: none;
        padding: 0;
    } 

然而，这样的样式并不能完全去除3像素问题。为此，我们需要添加一些样式来完全解决它。

 img {
        display: block;
        margin: 0;
        border: none;
        padding: 0;
        line-height: 0;
        font-size: 0;
    } 

这样的样式可以完全去掉图像周围的空白间距，解决“3像素问题”。

当然，也可以将样式应用于特定的图像，而不是全局应用。例如:

 .no-margin {
        display: block;
        margin: 0;
        border: none;
        padding: 0;
        line-height: 0;
        font-size: 0;
    } 

这样，只需要为你想要的图像添加no-margin类，就可以完全去除3像素问题了。