用伪类写的边框和用border写的边框都是1px啊，怎么就不一样了

Question

用伪类写的边框和用border写的边框都是1px啊，怎么就不一样了

Answer 1

ustbhuangyi 2016-12-23 02:07:26

1像素边框的原理是利用了 scale 缩放，而且只缩放线，不会缩放元素本身。

• 提问者 lyhzwf #1

  非常感谢！

• UltraNeo #2

  老师你扯了硬件分辨率后反而让我更糊涂了，我的理解是，在iphone6上的dip就是375*667，设置了meta的width=device-width之后，实际开发只管dip就行了，PC和移动端都是一样的。对于老师说的这个边框，我加大到了100px粗，两边的显示依然相同，后面的元素也是仅仅贴在border下面，所以无论是线的显示效果，还是元素本身，两边都是一样的，我把截图放在了自己提的一个同类问题中，不知道是不是我搞错了？

• UltraNeo #3

  刚才没有看完视频，看完这一节，我想我是搞错了，视频中说的1px指的是设计图中的1px，所以1px的border，在dpr为2的手机上指的是0.5px粗。老实说，这里确实有点绕，老师从头到尾讲的多少px都是针对原设计图来说的，而不是针对手机dip。
  
  但是这里又有别的问题，既然border要考虑手机dip的问题，那字体大小要不要考虑呢？设计图28px的字体，难道对于dpr为1.5的手机要单独搞一个28／1.5的字体大小？各种元素高度呢？

点开查看后面3条评论