帮助教程

  • 手机html5底部悬停固定客服代码 图标电话地址在线咨询

    最近更新时间:2019-02-16 22:10:23 150

    image.png

    效果如上

    代码如下

    css

    /* 底部悬停 在线咨询 wangsir.cn 20190216 原创发布 QQ915688610*/ 
    .footfixed{
    position: fixed;
    bottom:0;
    width:100%;
    background:#555;
    z-index: 99999;
    padding: 8px 0 5px;
    }
    .footfixed ul{width:100%;float:left;    margin: 0;
        padding: 0;}
    .footfixed ul li{width:33.333%;float: left;text-align: center;}
    .footfixed ul li a{color:#fff;font-size:0.8em;} 
    .footfixed ul li i{font-size:2em;}

    html

    <!-- 底部悬停 在线咨询  wangsir.cn 20190216 原创发布 QQ915688610-->
    <div class="footfixed">
    <ul>
    <li><a href="{dede:global.online/}" target="_blank"><i class="fa fa-commenting" aria-hidden="true"></i><br>在线咨询</a></li>
    <li><a href="tel:{dede:global.tel/}" target="_blank"><i class="fa fa-phone" aria-hidden="true"></i><br>电话咨询</a></li>
    <li><a href="{dede:type typeid='14'}[field:typelink/]{/dede:type}" target="_blank"><i class="fa fa-university" aria-hidden="true"></i><br>校区地址</a></li>
    </ul>
    </div>
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <!-- 底部悬停 在线咨询  wangsir.cn 20190216 原创发布 QQ915688610-->



    以上内容是否对您有帮助?
  • Close