CSS简单写三角形

最近写网页看到很多小型三角形 就比如：

那么 怎样不用ps切图来做到类似的效果呢
首先：
给一个div盒子，盒子有四个边 我们设置四个边为透明色 border的宽度就是我们要的三角形的大小 我们给了一个透明色之后 我们会看看不到 接下来就是给上我们需要的角颜色 就是套上border-top border-left border-bottom boder-right 四个属性并给一个颜色的属性值 这样 一个三角形就出来了

 .triangle{
    border: 10px solid rgba(0,0,0,0);
    border-left-color:#000;
}

还有那种回到顶部的图案

一个很简单的方法
红色大盒子里面放个要做出这种效果的小盒子
我们给border-top 和 border-left 一个小边边
接着将它旋转45°就好了
如果想要移动位置 就给小盒子套上absolute
给父元素一个relative

		.red{
            position: relative;
        }
        .sanjiao{
            width: 5px;
            height: 5px;
            position: absolute;
            border-top: 1px solid #fff;
            border-left: 1px solid #fff;
            top: 0;
            left: 0;
        }

定位top left right bottom 根据自己需要更改

一点小分享，大佬勿喷。