CSS 伪类实现弧形


.head-section{
    width: 100%;
    height: 360px;
    position: relative;
    z-index: -1;
    overflow: hidden;
}
.head-section::after{
    content: '';
    display: block;
    width: 160%;
    height: 200%;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: -100%;
    transform: translateX(-50%);
    background: #1677D2;
    background-image: linear-gradient(150deg, #084797, #007AFF);
}


声明:本站所有文章和图片,如无特殊说明,均为原创发布,转载请注明出处。
随机推荐
WordPress 侧边栏小工具
Node.js querystring 模块
HTML 弹跳式的滚动一行文字
JavaScript ES6 模块
WordPress 上传附件
用 JavaScript 实现数字增加滚动动画
Node.js http 模块
Express 使用 method-override 处理动词覆盖