css - 微博手机网页端是如何实现1px边框的
伊谢尔伦
伊谢尔伦 2017-04-17 13:41:40
0
6
487

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

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

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

全部回复(6)
PHPzhong

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

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

Peter_Zhu

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

大家讲道理

使用 transform 的 scale

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

几种方法实现

https://codepen.io/yangg/pen/...

PHPzhong

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

Ty80

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

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板