手机上html页面边框,【retina】手机上 1PX 边框_html/css_WEB-ITnose

1像素边框，在2倍屏幕上为2“占位”，3倍屏上为3“占位”，但设计师就要1“占位”

1 .content h1:after, 2 .content h2:after { 3 border-top: 1px solid #bfbfbf; 4 content: ' '; 5 display: block; 6 width: 100%; 7 position: absolute; 8 left: 0; 9 bottom: 0;10 -webkit-transform-origin: left bottom;11 }12 /* Retina 适配 */13 @media only screen and (-webkit-min-device-pixel-ratio: 2.0),14 only screen and (min--moz-device-pixel-ratio: 2.0),15 only screen and (-o-min-device-pixel-ratio: 200/100),16 only screen and (min-device-pixel-ratio: 2.0) {17 .content h1:after,18 .content h2:after {19 -webkit-transform: scaleY(0.5);20 transform: scaleY(0.5);21 }22 }23 24 /* 三倍屏 适配 */25 @media only screen and (-webkit-min-device-pixel-ratio: 2.5),26 only screen and (min--moz-device-pixel-ratio: 2.5),27 only screen and (-o-min-device-pixel-ratio: 250/100),28 only screen and (min-device-pixel-ratio: 2.5) {29 .content h1:after,30 .content h2:after {31 -webkit-transform: scaleY(0.33333334);32 transform: scaleY(0.33333334);33 }34 }

声明：本文原创发布php中文网，转载请注明出处，感谢您的尊重！如有疑问，请联系admin@php.cn处理