微博手机网页端是如何实现1px边框的

微博手机网页端是如何实现1px边框的?

正常写手机版网页1px在高分屏上通常都不止1个像素
但是打开微博网页版,消息、我,这两页边框都是真正的1个像素,请问如何实现的。

阅读 3.9k
6 个回答

你可以看我那天提问的问题,我最后的解决方案是这样的,判断手机修改viewport,在车上,没代码,你可以参考链家手机版,查看头部那串meta的js。

http://jinlong.github.io/2015...

可以直接用背景图的形式,不设置border

使用 transform 的 scale

border-bottom: 1px solid #D5D5D6
transform:scaleY(0.5);

设置一个伪元素,宽高200%,设置他的边框为1px,然后用css3缩小一倍,能同时把border缩小为0.5px,其他单边边框同理

现在比较流行(靠谱)的方法就是用伪元素画线,然后transform:scale(0.5)
你可以参照下微信的那套weui,里面所有的border都是这么写的
微信官方都这么写了,应该是没问题了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题