移动端一像素方案
2018-12-08 本文已影响2人
前端来入坑
以vue中使用stylus为例
mixin.stylus
border-1px($color)
position : relative
&:after
display: block
position: absolute
left: 0
bottom: 0
border-top 1px solid $color
width: 100%
content: ''
border-none()
&:after
display: none
同样的,在需要写1像素边框的地方引入这段代码,使用的时候直接用border-1px(yourColor)
就可以了,
不需要的时候用border-none()
就可以了。
<style lang="stylus" rel="stylesheet/stylus">
@import '../../common/stylus/mixin.styl';
.text
border-1px(rgba(7, 17, 27, 0.1))
.text
border-none()
</style>