DIV
<div class="mapdaohang">
<a href="https://surl.amap.com/7d9OsE1faeQ">
<i class="iconfont icon-map"></i>
</a>
</div>
CSS 引用 iconfont
<link rel="stylesheet" href="//at.alicdn.com/t/font_1876690_xdmjsxzdn2k.css" target="_blank" rel="external nofollow" >
CSS
.mapdaohang{
position: fixed;
bottom: 4vh;
right: 5vw;
z-index: 999;
border-radius: 100%;
box-shadow:0 1px 2px rgba(0,0,0,.3);
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
overflow:hidden;
/*padding:0.5rem;*/
background: rgba(0, 0, 0, 0.8);
box-sizing: border-box;
-webkit-animation-timing-function:ease-in-out;
-webkit-animation-name:breathe;
animation-duration:2000ms;
-webkit-animation-duration:2000ms;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
}
.mapdaohang .iconfont{
font-size: 22px;
color: #fff;
}
@-webkit-keyframes breathe {
0% {
border:1px solid rgba(59,235,235,1);
box-shadow:0 1px 2px rgba(255,255,255,0.1);
}
100% {
border:1px solid rgba(59,235,235,1);
box-shadow:0 1px 30px rgba(59,255,255,1);
}
}