css 外圆角旋转,外圆角实现(css)

您所在的位置:网站首页 css反圆角 css 外圆角旋转,外圆角实现(css)

css 外圆角旋转,外圆角实现(css)

2024-07-01 05:38| 来源: 网络整理| 查看: 265

效果图:![](https://box.kancloud.cn/725de3b318d013c51ff91ef7757f652b_260x99.png)

```

```

```

.test {

position: relative;

margin-top: 20px;

}.left {

position: absolute;

top: 0;

width: 50px;

height: 50px;

line-height: 100px;

display: block;

text-align: center;

background-image: radial-gradient(200px at 0px 0px, #fff 50px, #4ebaba 50px);

}

.middle {

width: 150px;

height: 50px;

background: #4ebaba;

position: absolute;

top: 0;

margin-left: 50px;

border-top-right-radius: 10px;

border-top-left-radius: 10px;

}

.right {

position: absolute;

top: 0;

margin-left: 200px;

width: 50px;

height: 50px;

line-height: 100px;

display: block;

text-align: center;

background-image: radial-gradient(200px at 50px 0px, #fff 50px, #4ebaba 50px);

}

```



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3