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

hug*_*rth 3 html css html5 css3

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

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

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

Bra*_*ers 5

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

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

边界半径解

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

图像解决方案

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