retina屏实现border边框1px

.border {
position: relative;
width: 300px;
height: 200px;
}
.border:after {
border: 1px solid #ff3300;
display: block;
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transform-origin: 0 0;
-webkit-transform: scale(1);
pointer-events: none;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
.border:after {
right: -100%;
bottom: -100%;
-webkit-transform: scale(0.5);
}
}

 

posted @ 2016-04-13 15:11  不晚不晚  阅读(147)  评论(0)    收藏  举报