#### 此處為字體圖標代碼列表，可以將需要的進行替換和添加 ``` 短信代碼 &#xe602; 首頁 &#xe62e; QQ &#xe604; 撥打電話 &#xe603; 返回頂部 &#xe63c; 需求中心 &#xe666; 在線客服 &#xe665; 取消百度商橋吸底 #newBridge #nb_toolbar_wrap{opacity: 0!important} ``` ``` <style> /* 手機端返回頂部上移+去掉自帶吸底+底部footer撐高*/ @media only screen and (max-width:640px){ .do-gotop{bottom:60px;} .do-online-service { display: none; } #footer_0{padding-bottom:50px;} } /*手機端顯示 電腦端隱藏*/ @media only screen and (max-width: 640px){section{display:block}} @media only screen and (min-width: 640px){section{display:none}} /* 阿里字體圖標庫 */ @font-face { font-family: 'iconfont'; /* project id 373198 */ src: url('//at.alicdn.com/t/font_373198_zoag1w36yf.eot'); src: url('//at.alicdn.com/t/font_373198_zoag1w36yf.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_373198_zoag1w36yf.woff') format('woff'), url('//at.alicdn.com/t/font_373198_zoag1w36yf.ttf') format('truetype'), url('//at.alicdn.com/t/font_373198_zoag1w36yf.svg#iconfont') format('svg'); } .iconfont{ font-family:"iconfont" !important; font-size:20px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } section .tabs { margin: 0 auto; width: 100%; font-weight: 300; font-size: 1.25em; } /* Nav */ .tabs nav { text-align: center; } .tabs nav ul { position: relative; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: flex; margin: 0 auto; padding: 0; max-width: 1200px; list-style: none; -ms-box-orient: horizontal; -ms-box-pack: center; -webkit-flex-flow: row wrap; -moz-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; } .tabs nav ul li { position: relative; z-index: 1; display: block; margin: 0; text-align: center; -webkit-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; box-shadow:rgba(74, 73, 73, 0.51)9px -7px 30px; } .tabs nav a { position: relative; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.1; text-decoration: none; } .tabs nav a span { vertical-align: middle; font-size: 14px!important; } .tabs nav li.tab-current a { color: #74777b; } .tabs nav a:focus { outline: none; } /*****************************/ /* Top Line */ /*****************************/ .tabs-style-topline { max-width: 1200px; } .tabs-style-topline nav li { } .tabs-style-topline nav li:not(:last-child) { border-right: none; } .tabs-style-topline nav li.tab-current { border-top-color: #2CC185; border-bottom: none; } .tabs-style-topline nav a { padding: 0.75em 0 0.75em; background: #f9f9f9; color: #fff; -webkit-transition: color 0.2s; transition: color 0.2s; } .tabs-style-topline nav a:hover, .tabs-style-topline nav a:focus { } .tabs-style-topline nav li.tab-current a { background: none; box-shadow: inset 0 3px 0 #2CC185; color: #2CC185; } .tabs-style-topline .icon::before { display: block; margin: 0; } .tabs-style-topline nav a span { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; font-size: 0.5em;margin: 12px; } </style> <!-- 底部基本HTML--> <section style="position: fixed; bottom: 0; width: 100%;z-index:999;left:0"> <div class="tabs tabs-style-topline"> <nav> <ul> <li><a href="tel:手機號" style="background:#背景色號" ><i class="iconfont">&#xe603;</i><span>點擊免費通話</span></a></li> <!--商橋彈窗效果 給超鏈接加入 id="nb_icon_wrap" 并刪除href --> <li><a target="_blank" href="溝通鏈接" style="color: #文字色號;" onclick="" ><i class="iconfont">&#xe665;</i><span>在線咨詢</span></a></li> </ul> </nav> </div><!-- /tabs --> </section> ```