1px物理像素，js移动端; css三角形

最新推荐文章于 2024-07-29 13:41:59 发布

原创最新推荐文章于 2024-07-29 13:41:59 发布 · 413 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

26 篇文章

订阅专栏

本文介绍如何使用CSS实现1px物理像素的线条效果，并通过边框技巧创建一个向下指向的等腰直角三角形。这些技巧对于前端开发者来说非常实用，能够帮助优化网站的设计细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1px 物理像素

.line_1p{
    position: relative;
    border:none;
    &:after{  
      content: '';
      position: absolute;
      bottom: 0;
      background: #BFBFBF ;
      width: 100%;
      height: 1px;
      transform: scaleY(0.5);
    }
}

向下的等腰直角三角形

.triangle-down {   
width:0;   
height:0;
border-top:20px solid red;   
border-left:20px solid transparent;   
border-right:20px solid transparent;  
}