html - 添加边框半径时边框和图像之间的间隙

标签 html image css

我有一个边界半径为 50% 且周围有 3px 边界的图像。 我的问题是当给定边框半径时,图像和边框之间有 1px 的间隙。

问题如下图所示。

enter image description here

还有我正在使用的 css,

img {
    border: 3px solid #4CB7AC;
    height: 46px;
    width: 46px;
    border-radius:50%;
}

注意

  • 图片大小为 46 像素 X 46 像素。未调整大小。
  • 我必须使用 <img>获取图像。排除将其设置为背景图像的可能性。
  • 解决方案必须与所有浏览器兼容。甚至 IE8。

有没有办法消除这个差距?

编辑 JS Fiddle link

最佳答案

只需添加与您的边框颜色相同的背景颜色,它就固定了。

参见 jsFiddle

关于html - 添加边框半径时边框和图像之间的间隙,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23490320/

相关文章:

asp.net - 调用aspx页面随机返回图像慢

android - 如何在从字节数组上传数据到 PHP 服务器时获取上传进度?

html - 垂直对齐 : middle - why must the first item be aligned middle?

html - 自定义 Bootstrap 表

html - 如何防止高像素比设备(视网膜)上的半像素 SVG 偏移?

html - 在另一个图像悬停时更改图像的位置

c# - Winforms:在鼠标悬停时更改 Datagridview 图像

html - 单个对象的样式表

html - 为我的页脚添加底部边框和图标

javascript - 使用 mailto 设置电子邮件优先级