[css] 80. 怎么样实现边框 0.5 个像素？

[qiilee]

[sinnkirou]

CSS3有缩放的属性，我们可以利用这个属性，缩小50%的1px的边框。

<div class="border3">
    <div class="content">伪类设置的边框</div>
</div>    

.border3{
     position: relative;         
 }
 
.border3:before{
       content: '';
       position: absolute;
       width: 200%;
       height: 200%;
       border: 1px solid red;
       -webkit-transform-origin: 0 0;
       -moz-transform-origin: 0 0;
       -ms-transform-origin: 0 0;
       -o-transform-origin: 0 0;
       transform-origin: 0 0;
       -webkit-transform: scale(0.5, 0.5);
       -ms-transform: scale(0.5, 0.5);
       -o-transform: scale(0.5, 0.5);
       transform: scale(0.5, 0.5);
       -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
       box-sizing: border-box;
}