共计 779 个字符,预计需要花费 2 分钟才能阅读完成。
移动端通用 mixins stylus 版
基础配置
$green = #02a774;
$yellow = #F5A100;
$bc = #e4e4e4;
// 一像素下边框
bottom-border-1px($color)
position relative
border none
&:after
content ''
position absolute
left 0
bottom 0
width 100%
height 1px
background-color $color
transform scaleY(0.5)
// 一像素上边框
top-border-1px($color)
position
&::before
content ''
position absolute
z-index 200
left 0
top 0
width 100%
height 1px
background-color $color
// 根据像素比缩放 1px 像素边框
@media only screen and (-webkit-device-pixel-ratio: 2)
.border-1px
&::before
transform scaleY(.5)
@media only screen and (-webkit-device-pixel-ratio: 3)
.border-1px
&::before
transform scaleY(.333333)
// 根据像素比来使用 2x 图 3x 图
bg-image($url)
background-image: url($url + "@2x.png")
@media (-webkit-min-device-ratio: 3),(min-device-pixel-ratio: 3)
background-image: url($url + "@3x.png")
// 清除浮动
clearFix()
*zoom 1
&::after
content ''
display block
clear both
正文完
发表至: javascript
2019-08-31