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);
}


声明:本站所有文章和图片,如无特殊说明,均为原创发布,转载请注明出处。
随机推荐
CSS 盒模型
JavaScript 流程控制语句
JavaScript 流式传输数据 SSE (Server-Sent Events)
JavaScript 修改 CSS 样式
Notifications API
Land APP 小程序
JavaScript 的 this 指向
JavaScript 代码混淆加密工具 javascript-obfuscator