📝 代码查看
使用runcode.html页面

1
查看次数
2025-11-29
创建时间
2025-11-29
最后更新
<div class="thin-line">上为1px的线，下为利用伪元素绘制的0.3px的细线</div>

.thin-line {
  height: 40px;
  line-height: 40px;
  position: relative;
  border-top: 1px solid #ff4891;
}

.thin-line:after {
  content: "";
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  top: auto;
  background-color: #ff4891;
  display: block;
  -webkit-transform-origin: 100% 0;
  transform-origin: 100% 0;
  -webkit-transform: scaleY(0.3);
  transform: scaleY(0.3);
}
暂无JavaScript代码

👁️ 实时预览