[Retina] The 1 px border on the mobile phone, and the value of the chain

[Retina] The 1 px border on the mobile phone, and the value of the chain
 

1 pixel border, 2 "Placeholder" on the screen at 2x, 3 "Placeholder" on the screen at 3x, but the designer needs 1 "Placeholder"

 

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 adaptation */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/* triple screen adaptation */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}