怎么在手机端是实现1px的边框

最新推荐文章于 2022-07-19 16:09:18 发布

Zyl_CN

最新推荐文章于 2022-07-19 16:09:18 发布

阅读量326

点赞数 1

分类专栏：小练习 H5+C3

本文链接：https://blog.csdn.net/Zyl_CN/article/details/90230810

版权

小练习同时被 2 个专栏收录

32 篇文章 2 订阅

订阅专栏

H5+C3

15 篇文章 0 订阅

订阅专栏

单边像素边

.scale-1px {
   position: relative;
   border: none;
 }
 .scale-1px:after {
   content: "";
   position: absolute;
   bottom: 0; /*这边的top、bottom、left、right是用来定义那个边的*/
   background: #000;
   width: 100%;
   height: 1px;
   transform: scaleY(0.5);
   transform-origin: 0 0;
 }

4边的像素边

.scale-1px {
   position: relative;
   border: none;
}
.scale-1px:after {
  content: "";
  position: absolute;
  border: 1px solid #000;
  top: -50%;
  right: -50%;
  left: -50%;
  bottom: -50%;
  transform:scale(0.5);

}