html+css怎么写出“分享到”前面的小箭头？

如果要写的话也是可以的，但是一般情况下没有人会去浪费时间在这个图标上，一般直接通过切图用图片代替，获取使用字体图标，如果要写的话就是一个蓝色的圆然后再有一个白色的圆盖住它的大部分，最后一个三角形定位，最后拼出来，这样下来就很浪费时间，如果是使用图片，直接设置一个宽，然后做图片自适应就可以了

一个分享按钮，一个隐藏的图片（这个图片绝对定位在右上角）然后就是点击显示，点击隐藏了。

<a href="javascript:" onclick="document.getElementById('mcover').style.display='block'">分享到朋友圈</a>

<div id="mcover" onclick="document.getElementById('mcover').style.display=''" style="display: none">

<img src="/public/images/guide.png">

</div>

对应样式如下：

#mcover {

position: fixed

top: 0

left: 0

width: 100%

height: 100%

background: rgba(0, 0, 0, 0.7)

display: none

z-index: 20000

}

#mcover img {

position: fixed

right: 18px

top: 5px

width: 260px

height: 180px

z-index: 999

}

---