css 绘制上，下，右，左箭头

最新推荐文章于 2024-05-07 21:52:18 发布

老胡说前端

最新推荐文章于 2024-05-07 21:52:18 发布

阅读量3.8k

点赞数 1

分类专栏： css html5 文章标签： css servlet java

本文链接：https://blog.csdn.net/m0_65730686/article/details/126727162

版权

css 同时被 2 个专栏收录

9 篇文章 0 订阅

订阅专栏

html5

6 篇文章 0 订阅

订阅专栏

1 上箭头

.drawJt{
           border: 4rpx solid #c2c0c0;
           width: 40rpx;
           height: 40rpx;
           border-left-color: transparent;
           border-top-color: transparent;
           transform: rotate(-135deg);//上箭头
           margin: 0 auto;
           margin-top: 20rpx;
       }

2 下箭头

.drawJt{
           border: 4rpx solid #c2c0c0;
           width: 40rpx;
           height: 40rpx;
           border-left-color: transparent;
           border-top-color: transparent;
           //下箭头
           //transform: rotate(45deg);
           margin: 0 auto;
           margin-top: 20rpx;
       }

3 左箭头

.drawJt{
           border: 4rpx solid #c2c0c0;
           width: 40rpx;
           height: 40rpx;
           border-left-color: transparent;
           border-top-color: transparent;
           transform: rotate(135deg);//左箭头
           margin: 0 auto;
           margin-top: 20rpx;
       }

4右箭头

.drawJt{
           border: 4rpx solid #c2c0c0;
           width: 40rpx;
           height: 40rpx;
           border-left-color: transparent;
           border-top-color: transparent;
           transform: rotate( -45deg);//右箭头
           margin: 0 auto;
           margin-top: 20rpx;
       }