移动端1px边框

  .solid{
      position: relative;
  }
  .solid:after{
      content: " ";
      width: 200%;
      height: 200%;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: inherit;
      transform: scale(0.5);
      transform-origin: 0 0;
      pointer-events: none;
      box-sizing: border-box;
      border: 1px solid rgba(0, 0, 0, 0.1);
  }
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • 移动端1px边框问题
    造成边框变粗的原因 其实这个原因很简单，因为css中的1px并不等于移动设备的1px，这些由于不同的手机有不同的像...
    我向你奔阅读 1,120评论 0赞 2
  • 移动端1px边框完美解决办法
    移动端1px边框在手机上看比较粗，参照京东web端的做法，结合伪类after，如图： 解决办法 可完美解决，但是比...
    柒子YOYO阅读 722评论 0赞 0
  • 移动端1px边框的实现
    移动端1px的边框是非常常见的效果,在各种app或者网页上大量用到,比如微信和qq的联系人列表等.然而,当我们用c...
    勇PAN高峰阅读 1,209评论 0赞 3
  • 移动端1px边框详解
    第一种 .b-b{ position:relative; } .b-b:after{ content:""; po...
    北上广_d8bd阅读 431评论 0赞 0
  • 移动端1px边框问题
    解决方案一 使用rem为单位。 使用js获取dpr值动态计算视口缩放，设置viewport content属性。 ...
    D_R_M阅读 1,113评论 0赞 1