解决父级使用backdrop-filter后,子级再使用不生效 2023-2-11 10:27 | 186 | 0 | 教程 66 字 | 2 分钟 发现果如父级使用了backdrop-filter,再在子级使用就不生效,最后发现可以使用伪类解决before 代码如下: .header { height: 1rem; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2); position: fixed; left: 0; right: 0; top: 0; z-in… CSS
纯 CSS 实现优惠券透明圆形镂空打孔效果 2021-9-18 10:00 | 1,706 | 2 | 前端 257 字 | 7 分钟 我们在做商城类项目时,时常会有开发优惠券的需求,那么我们如何通过纯 CSS 来实现类似京东、淘宝的优惠券样式。 下面给大家分享一个纯 CSS 写的优惠券边沿透明圆形镂空打孔效果。最终效果大致如下: 使用了生成二维码和点击复制jquery.qrcode.min.js、clipboard.min.js两个插件 方法一 div{ width:300px;… CSS CSS点击选中文本内容 2020-4-30 17:13 | 2,650 | 0 | 教程 102 字 | 4 分钟 CSS 属性 user-select 控制用户能否选中文本。 HTML代码: <div class="wrapper"> <h1>Here's Your Code Snippet!</h1> <p>Click below to select all. Click again to clear so y… CSS 解决iOS下button按钮样式渐变背景问题 2019-6-28 17:50 | 2,126 | 0 | 前端 37 字 | 1 分钟内 只需要加上这个样式即可 .form_content .btn-submit{ width: 100%; padding: 1rem; background: #ff6471; color: #fff; border: none; line-height: 3rem; font-size: 1.5rem; -webkit-appearance:non… CSS 解决width: 100%;再设置padding问题 2018-4-24 18:38 | 2,407 | 0 | 前端 23 字 | 1 分钟内 在后面加上box-sizing: border-box;就OK了 .footer_nav{ width: 100%; overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to right, rgb(255, 103, 109)… CSS 解决width: 100%;再设置margin问题 2018-4-24 18:36 | 2,848 | 0 | 前端 21 字 | 1 分钟内 把width: 100%;改成width: calc(100% - 16px);就OK了 .footer_nav{ width: calc(100% - 16px); overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to … CSS div不定宽高的居中方式 2018-1-24 9:20 | 1,582 | 0 | 前端 45 字 | 2 分钟 方法1 .demo1{ position:absolute; top:50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 方法2 .demo2{ display: flex; align-items: center… CSS 不定宽使用css居中 2017-11-23 14:28 | 1,517 | 0 | 前端 25 字 | 1 分钟内 <div class="wrap"> <div class="index-title"> <div class="bd"> <div class="t"><i>标题</i>标题标题标题</div> <div class="p">内容内容内容内容内容内容内… CSS
CSS点击选中文本内容 2020-4-30 17:13 | 2,650 | 0 | 教程 102 字 | 4 分钟 CSS 属性 user-select 控制用户能否选中文本。 HTML代码: <div class="wrapper"> <h1>Here's Your Code Snippet!</h1> <p>Click below to select all. Click again to clear so y… CSS
解决iOS下button按钮样式渐变背景问题 2019-6-28 17:50 | 2,126 | 0 | 前端 37 字 | 1 分钟内 只需要加上这个样式即可 .form_content .btn-submit{ width: 100%; padding: 1rem; background: #ff6471; color: #fff; border: none; line-height: 3rem; font-size: 1.5rem; -webkit-appearance:non… CSS 解决width: 100%;再设置padding问题 2018-4-24 18:38 | 2,407 | 0 | 前端 23 字 | 1 分钟内 在后面加上box-sizing: border-box;就OK了 .footer_nav{ width: 100%; overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to right, rgb(255, 103, 109)… CSS 解决width: 100%;再设置margin问题 2018-4-24 18:36 | 2,848 | 0 | 前端 21 字 | 1 分钟内 把width: 100%;改成width: calc(100% - 16px);就OK了 .footer_nav{ width: calc(100% - 16px); overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to … CSS div不定宽高的居中方式 2018-1-24 9:20 | 1,582 | 0 | 前端 45 字 | 2 分钟 方法1 .demo1{ position:absolute; top:50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 方法2 .demo2{ display: flex; align-items: center… CSS 不定宽使用css居中 2017-11-23 14:28 | 1,517 | 0 | 前端 25 字 | 1 分钟内 <div class="wrap"> <div class="index-title"> <div class="bd"> <div class="t"><i>标题</i>标题标题标题</div> <div class="p">内容内容内容内容内容内容内… CSS
解决width: 100%;再设置padding问题 2018-4-24 18:38 | 2,407 | 0 | 前端 23 字 | 1 分钟内 在后面加上box-sizing: border-box;就OK了 .footer_nav{ width: 100%; overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to right, rgb(255, 103, 109)… CSS
解决width: 100%;再设置margin问题 2018-4-24 18:36 | 2,848 | 0 | 前端 21 字 | 1 分钟内 把width: 100%;改成width: calc(100% - 16px);就OK了 .footer_nav{ width: calc(100% - 16px); overflow:hidden; margin-bottom:0; position:fixed; bottom:0; background: linear-gradient(to … CSS
div不定宽高的居中方式 2018-1-24 9:20 | 1,582 | 0 | 前端 45 字 | 2 分钟 方法1 .demo1{ position:absolute; top:50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 方法2 .demo2{ display: flex; align-items: center… CSS
不定宽使用css居中 2017-11-23 14:28 | 1,517 | 0 | 前端 25 字 | 1 分钟内 <div class="wrap"> <div class="index-title"> <div class="bd"> <div class="t"><i>标题</i>标题标题标题</div> <div class="p">内容内容内容内容内容内容内… CSS