圆角图像或边界半径100%？

Question

我对页面上的圆角元素有疑问.例如,我有一个不圆的小徽标,我想把它放在圆形背景(120x120).像这样制作div更好吗:

border-radius: 100%;
background-color: red;
background-image: url('logo.png');
background-position: center;

或者只是为例如创建一个图像.瘸子？

Answer 1

如果您将来要在圆形背景上使用徽标(例如传单,电子邮件等),可能更容易在gimp或替代品中创建徽标版本,因此可以在任何地方快速使用.

如果不是真的只是个人偏好,每个都有优点和缺点.

边界半径解

• 如果您想使用媒体查询,可以删除某些屏幕上的背景
• 更快实现.
• 背景尺寸,颜色和半径可以在以后的阶段轻松更改.
• 半径在任何显示器上都保持高质量/分辨率.

图像解决方案

• 更好的浏览器支持
• 可用于未来的出版物.