1 pixel border, twice times the screen is 2 "placeholder", 3 times times the screen is 3 "placeholder", but the designer will have 1 "placeholder"
1 . Content H1:after,2 . Content H2:after {3border-top:1px solid #bfbfbf;4Content: ';5 Display:block;6width:100%;7 Position:absolute;8left:0;9bottom:0;Ten-webkit-transform-Origin:left Bottom; One } A /*Retina Adaptation*/ -@media only screen and (-webkit-min-device-pixel-ratio:2.0), -Only screen and (min--moz-device-pixel-ratio:2.0), theOnly screen and (-o-min-device-pixel-ratio:200/100), -Only screen and (min-device-pixel-ratio:2.0) { - . Content H1:after, - . Content H2:after { +-webkit-transform:scaley (0.5); -Transform:scaley (0.5); + } A } at - /*three times times screen fit*/ -@media only screen and (-webkit-min-device-pixel-ratio:2.5), -Only screen and (min--moz-device-pixel-ratio:2.5), -Only screen and (-o-min-device-pixel-ratio:250/100), -Only screen and (min-device-pixel-ratio:2.5) { in . Content H1:after, - . Content H2:after { to-webkit-transform:scaley (0.33333334); +Transform:scaley (0.33333334); - } the}
1PX border on "Retina" phone