织梦网站移动端底部增加悬浮咨询窗口(PC端隐藏)

做网站除了流量之外,最大的问题就是用户转化,因此很多时候我们需要在网站底部增加悬浮咨询窗口,今天就分享一个简单的网站底部增加悬浮咨询窗口的代码实现教程。

话不多说,上代码:

<!--移动端底部咨询浮窗-->
<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;}

最终效果:

内容版权声明:除非注明,否则皆为SEO博客原创文章。

姜成SEO技术交流群

转载注明出处:https://www.seoblogs.cn/dedecms/20203500.html

跟大家分享一下你的看法吧!
  • 全部评论(0
    还没有评论,快来抢沙发吧!