随笔分类 -  css样式问题

边框渐变（兼容圆角和背景色）
摘要：.box { width: 100%; border-radius: 48rpx; margin-top: 24rpx; border: 2rpx solid transparent; //transparen加上 background-clip: padding-box, border-box; 阅读全文
posted @ 2025-07-31 16:13 light丶 阅读(9) 评论(0) 推荐(0)
css值参
摘要：<div :style="{'--heiaght':headerHeight +'px' }"></div> div{ height:var(--heiaght) } 还有一种方式 <div :data-content="200px"></div> div{ height:attr(data-con 阅读全文
posted @ 2023-11-28 13:59 light丶 阅读(49) 评论(0) 推荐(0)
css分隔虚线，双色样式（repeating-linear-gradient）
摘要：做购物车或者结算时有个分隔虚线 我们想做到双色分隔线时 可以使用一个div来或者使用:before伪类元素来做底部的虚线 这里我是使用的伪类元素 我们使用address-wrap的伪类来做底部虚线，直接贴出样式 .address-wrap{ position: relative; &::before 阅读全文
posted @ 2021-07-29 11:18 light丶 阅读(1257) 评论(0) 推荐(1)
CSS文本溢出使用省略号
摘要：单行超出隐藏使用省略 max-width: 400rpx; /* 最宽400rpx */ white-space: nowrap; /* 不允许换行 */ overflow: hidden; /* 隐藏 */ text-overflow: ellipsis; /* 单选文本溢出使用省略号 */ 多行 阅读全文
posted @ 2020-12-14 10:00 light丶 阅读(235) 评论(0) 推荐(0)