css
M_allstar
所以我每个都选C
展开
-
css3的clip-path方法剪裁实现(三角形,多边形,圆,椭圆)
本例讲解如何通过clip-path把一个div(元素,可以是图片等)裁切成不同的形状,这里以一个div为例宽高均为300px注意:不支持IE和Firefox,支持webkit浏览器,在现代浏览器中需要使用-webkit-前缀。## 注意 clip-path 从右上开始顺时针旋转切割 <div class="demo" style="width: 300px; height: 300px; margin: auto; background: red;"> ...转载 2020-10-22 11:49:43 · 2914 阅读 · 0 评论 -
CSS渐变和混合
CSS渐变要点颜色、方向和位置linear-gradient// 一般写法,可以有一个以上的colorlinear-gradient(角度deg, color1 color-stop?长度px||百分比, color2 color-stop?长度px||百分比)线性渐变中的角度默认是从下到上的垂直方向开始顺时针进行旋转的。老版本浏览器有差别。radial-gradient// 一般写法,可以有一个以上的colorradial-gradient(<shape?>||<原创 2020-07-01 16:54:14 · 462 阅读 · 0 评论 -
字号计算,字体大小随窗口高度变化
//字号const fontSize = [50, 45, 40, 35, 30, 25, 20, 15, 10].map(item => {return window.innerHeight * item / 1050 //字号计算,1050基准值})export default fontSize原创 2020-04-23 12:05:24 · 543 阅读 · 0 评论 -
大屏scroll滚动轴样式
//滚动条.scrollbaroverflow auto// 在有滚动条的元素上加上该classname,只有鼠标进入元素区域内,滚动条才会有颜色.scrollbar:hover::-webkit-scrollbar-thumb// border-left 4px solid themeColorbackground-color: themeColor::-web...原创 2020-04-23 12:03:37 · 430 阅读 · 0 评论 -
stylus 迭代+插值实现css同类型不同值样式序列
$font-size-pt = {'72': 72px,'50': 50px,'42': 42px,'20': 20px,'14': 14px,}for $key, $value in $font-size-pt //迭代.fs{$key} //插值font-size: $value原创 2020-04-21 15:20:50 · 245 阅读 · 0 评论