1px像素的实现

来源:互联网 发布:数据库pdforacle网盘 编辑:程序博客网 时间:2024/05/01 19:06
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /><style type="text/css">.border{position: relative;}.border::after{display: block;position: absolute;left: 0;bottom: 0;width: 100%;border-top:1px solid rgba(7,17,27,0.1);content: " ";}@meta (-webkit-min-device-pixel-rato:1.5),(min-device-pixel-rato:1.5){.border-1px::after{-webkit-transform: scaleY(0.7);transform:scaleY(0.7)}}@meta (-webkit-min-device-pixel-rato:2),(min-device-pixel-rato:2){.border-1px::after{-webkit-transform: scaleY(0.5);transform:scaleY(0.5)}}</style></head><body>1px像素的实现<div class="border border-1px"></div></body></html>
利用meta判断设备像素是dpr的值来,缩放对应的比例
0 0
原创粉丝点击