admin管理员组

文章数量:1794759

CSS 伪类after ，制作反方向圆角

CSS 伪类after ，制作反方向圆角

 

<!DOCTYPE html> <html> <head> <meta charset="utf-8">  <title>菜鸟教程(runoob)</title>  <style>  div {     position: relative;     margin:0 auto;     padding:10px 40px;      background:#dddddd;     width:200px;     height:100px;     border-radius:25px 25px 0 0; }     div::after{       position: absolute;       content: '';       width: 30px;       height: 30px;       line-height: 100px;       display: block;       text-align: center;       background-image: radial-gradient(200px at 30px 0px, #fff 30px, #ddd 30px);       top : 90px;       right: -30px;     } </style> </head> <body>

<div>border-radius 属性允许您为元素添加圆角边框！ </div>

</body> </html>

-- 运行结果

 

本文标签： 圆角方向css

版权声明：本文标题：CSS 伪类after ，制作反方向圆角 内容由林淑君副主任自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.xiehuijuan.com/baike/1686969490a123688.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。