主要方法是缩小，逆viewport放大的操作，背景线性渐变用细分方式。简单起见（UI一般是640下的，相当于device pixel ratio 等于2）选的0.5，实际应该做区分，以免渲染错误，比如三星9100g 的Android浏览器 device pixel ratio是1.5，如果按0.5缩，有些写法会渲染不出细线来。

图片方式：

1. 默认，宽640x高1 px：

   通常失效

2. 宽320px 等比缩:

   不灵活，比例不对时可能失效

3. background：

   通常失效，但常用来做非1px的图片的响应式适配

4. transform scale:

推荐使用，不灵活，兼容性比border-image强，比例不对时一般也能正常显示

5. border-image：
   1px
   -webkit-border-image:url(../../img/line2.png) 2 repeat; border-image:url(../../img/line2.png) 2 repeat; border-width:1px

   对浏览器要求较高，兼容性差些，有可能出现粗细不均瑕疵，适合描多边

CSS方式：

1. border 1px：
   1px
   border:#080 1px solid

   通常失效

2. border thin：
   1px
   border:#080 thin solid

   通常失效，期望有这种简单实现

3. backgroud-color：
   height:1px; background-color:#080

   通常失效

4. box-shadow：
   1px
   1px
   -webkit-box-shadow:#080 0 0 1px inset; -webkit-box-shadow:#080 0 0 1px; box-shadow:#080 0 0 1px; box-shadow:#080 0 0 1px inset

   一种近似的模拟，不受圆角影响，可以尝试

5. backgroud-image + linear gradient：
   1px
   background:-webkit-gradient(linear, 0 0, 0 100%, from(#080), color-stop(50%, #080), color-stop(50%, transparent), to(transparent)); background:linear-gradient(#080, #080 50%, transparent 50%, transparent); background-repeat:no-repeat; background-size:100% 1px
   1px
   background: -webkit-gradient(linear, 0 0, 0 100%, from(#080), color-stop(50%, #080), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, 0 0, 100% 0, from(transparent), color-stop(50%, transparent), color-stop(50%, #080), to(#080)), -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(50%, transparent), color-stop(50%, #080), to(#080)), -webkit-gradient(linear, 0 0, 100% 0, from(#080), color-stop(50%, #080), color-stop(50%, transparent), to(transparent)); background: linear-gradient(#080, #080 50%, transparent 50%, transparent), linear-gradient(90deg, transparent, transparent 50%, #080 50%, #080), linear-gradient(transparent, transparent 50%, #080 50%, #080), linear-gradient(90deg, #080, #080 50%, transparent 50%, transparent); background-repeat:no-repeat; background-position:top,right,bottom,left; background-size:100% 1px, 1px 100%, 100% 1px, 1px 100%;

   推荐使用，比较灵活，代码稍多，适合多边

6. transform scale + background-color + pesudo element:
   1px
   .pes { position:relative} .pes::before { width:200%; height:1px; content:''; background:#090; position:absolute; top:0; left:0; -webkit-transform:scale(.5); -webkit-transform-origin:0 0; transform:scale(.5); transform-origin:0 0}

   推荐使用，比较灵活