移动端1px

来源:互联网 发布:淘宝联盟优惠券怎么用 编辑:程序博客网 时间:2024/05/21 14:44

1、通过viewport+rem的方式来兼容。
目前这种兼容方案相对比较完美。
2、transform:scale(0.5)
实现方式
height:1px;
-webkit-tranform:scale(0.5);
-webkit-transform-origin:(0);
overflow:hidden;
3、box-shadow
实现方式
利用css对阴影处理的方式实现0.5px的效果
底部一条线
-webkit-box-shadow:0.1px 1px -1px rgba(0,0,0.5);
优点:基本所有的场景都能满足,包含圆角的button,单条,多条线;
4、bacground-image
实现方式
设置1px通过css实现的image,50%有颜色,50%透明

原创粉丝点击