做网站除了流量之外,最大的问题就是用户转化,因此很多时候我们需要在网站底部增加悬浮咨询窗口,今天就分享一个简单的网站底部增加悬浮咨询窗口的代码实现教程。
话不多说,上代码:
<!--移动端底部咨询浮窗--> <div class="float_phone" style="height: 60px; background: #FF3F05; position: fixed; bottom: 0px; width: 100%; text-align: center;"> <a href="tel:888-88888" target="_blank" title="联系电话" style="text-align: center;width: 50px;"> <i class="fa fa-phone-square fa-2x" style=" margin: 10px;color: #fff;">888-88888</i> </a> </div> |
tel:888-8888,这里改成你的电话号码
需要在PC端隐藏,我们可以在css样式文件中加入下面代码:
/**PC端隐藏咨询浮窗**/ @media only screen and (min-width:1024px){.float_phone{display:none;} |
最终效果:
