stylus解决移动端1像素线等问题

引用了yo框架中的_border.scss(用来获取yo框架封装的border)   以及   variables.scss(用来获取媒体查询的规则)

 border($border-width = 1px, $border-color = #ccc, $border-style = solid, $radius = 0)
   // 为边框位置提供定位参考
   position: relative;
 
   if $border-width == null
     $border-width: 0;
 
   border-radius: $radius;
 
   &::after
     // 用以解决边框layer遮盖内容
     pointer-events: none;
     position: absolute;
     z-index: 999;
     top: 0;
     left: 0;
     // fix当元素宽度出现小数时，边框可能显示不全的问题
     // overflow: hidden;
     content: "\0020";
     border-color: $border-color;
     border-style: $border-style;
     border-width: $border-width;
 
     // 适配dpr进行缩放
     @media (max--moz-device-pixel-ratio: 1.49), (-webkit-max-device-pixel-ratio: 1.49),
　　　　　　    (max-device-pixel-ratio: 1.49), (max-resolution: 143dpi), (max-resolution: 1.49dppx)
       width: 100%;
       height: 100%;
       if $radius != null {
         border-radius: $radius;
       }
 
     @media (min--moz-device-pixel-ratio: 1.5) and (max--moz-device-pixel-ratio: 2.49), 
　　　　　　　　 (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 2.49),
　　　　　　　　 (min-device-pixel-ratio: 1.5) and (max-device-pixel-ratio: 2.49),
　　　　　　　　(min-resolution: 144dpi) and (max-resolution: 239dpi),
　　　　　　　　(min-resolution: 1.5dppx) and (max-resolution: 2.49dppx)
       width: 200%;
       height: 200%;
       transform: scale(.5)
       if $radius != null {
         border-radius: $radius * 2;
       }
 
     @media (min--moz-device-pixel-ratio: 2.5), (-webkit-min-device-pixel-ratio: 2.5),
　　　　　　　　 (min-device-pixel-ratio: 2.5),(min-resolution: 240dpi),(min-resolution: 2.5dppx)
       width: 300%;
       height: 300%;
       transform: scale(.33333)
       if $radius != null {
         border-radius: $radius * 3;
       }
 
     transform-origin: 0 0;

省略点ellipsis的解决方案（支持多行）

 wrap($is-wrap = true)
   if $is-wrap == true
     word-wrap: break-word;
     word-break: break-all;
   else
     white-space: nowrap;
 
 ellipsis($width = null, $line-clamp = 1)
   overflow: hidden;
   text-overflow: ellipsis;
   width: $width;
   if abs($line-clamp) > 1
     // 要使得多行截取生效，display的值只能为-webkit-box
     display: -webkit-box !important;
     -webkit-line-clamp: $line-clamp;
     flex-direction column
     wrap()
   else
     wrap(false)

将上述代码放入styl文件中，就可以直接使用！