相关疑难解决方法(0)

仅使用CSS在矩形图像上的圆角

我想使用半径边框从矩形图像创建圆形图像.

有没有简单的方法来实现这一点使用CSS而不扭曲图像并确保圆是完美的圆形.

看到失败的尝试:

.rounded-corners-2{
    border-radius: 100px;
    height: 150px;
    width: 150px;

Run Code Online (Sandbox Code Playgroud)

这可以只在CSS中完成吗？

css html5 css3

Sim*_*mon

lucky-day

23
推荐指数

4
解决办法

5万
查看次数

如何仅使用CSS来编写应用程序图标图像

我一直在摸索，试图弄清楚如何使用Code Player的CSS3 Squircles示例在我的网站上创建一个iOS-7风格的应用程序图标（在Safari浏览器中进行测试）。该示例使用伪标记来裁剪背景颜色，而我需要在周围裁剪<img>。如果您不熟悉，则鼠形就像一个圆角的矩形，但其侧面圆角超出了圆角半径，如下所示：

.icons img {
  width: 100px;
  height: 100px;

  border-radius: 24%;
}

.icons a {
  text-decoration: none;
  display: inline-block;
  position: relative;
}
/*Now we will create fish-eye shapes using pseudo elements and clip them to add a curve to the sides of the icons*/
.icons a:before, .icons a:after {
  content: '';
  position: absolute; left: 0; top: 0;
  width: 100%; height: 100%;
  background: inherit;
  border-radius: 100%; /*circle*/
  /*time to transform the circle …

Run Code Online (Sandbox Code Playgroud)

html css safari css3 ios

Dov*_*Dov

2015 10-07

2
推荐指数

1
解决办法

4154
查看次数