书写0.5px线条方式:

方法1:

.border_top {

background: url("data:image/svg+xml;utf8,") no-repeat;

}

.border_bottom {

background: url("data:image/svg+xml;utf8,") no-repeat;

}

.border_left {

background: url("data:image/svg+xml;utf8,") no-repeat;

}

.border_right {

background: url("data:image/svg+xml;utf8,") no-repeat;

}

方法2:

.border-bottom,.border-top{position: relative;}.border-bottom:after,.border-top:before{content: '';position: absolute;width: 200%;height: 1px;background: #eee;-webkit-transform: scale(0.5);transform: scale(0.5);z-index: 1;}.border-bottom:after{bottom: 0;left: 0;-webkit-transform-origin: 0 100%;transform-origin: 0 100%;}.border-top:before{top: 0;left: 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}

1����h8

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 各种纯css图标 CSS3可以实现很多漂亮的图形,我收集了32种图形,在下面列出。直接用CSS3画出这些图形,要比...
    剑残阅读 9,688评论 0 8
  • 1、垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,...
    kiddings阅读 3,199评论 0 11
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,335评论 0 11
  • 马云在云栖大会上第一次提出“新零售”这个概念。整个行业掀起了巨浪。各企业也加快了线上线下的融合。在新零售的大环境下...
    Kakie阅读 296评论 0 0
  • 1 蟹蟹是被汽水的哼哼声吵醒的。 她使劲儿的睁开眼皮,按亮手机,已经是上午九点半了。 “再不遛汽水,估计它又要拉在...
    如安如安阅读 237评论 0 0