网站移动端下方固定导航按钮的方法

网站移动端下方固定导航按钮的方法【网站移动端下方固定导航按钮的方法】现在互联网上的流量早已是移动端的天下，所以不少网站也在不断增强移动端的体验。移动端的网页同PC端相比屏幕小，展现的内容也相对较少，所以通常会多加一些按钮来引导读者朋友们。橘子君在网络上看到一种固定导航按钮的方法很不错，使用非常简单，特此记录分享一下。
实现该功能的代码
<style type="text/css">.nav{display:none;}@media only screen and (max-width:450px){.site-info{padding:15px 0 52px 0;}#advert_widget,.php_text .widget-text,.widget .textwidget{padding:0;}.nav{position:fixed;z-index:999;bottom:0;width:100%;height:52px;display:block;right:0;box-shadow:0px 0px 10px 3px rgba(223,233,247,1.0);-webkit-box-shadow:0px 0px 10px 3px rgba(223,233,247,1.0);-moz-box-shadow:0px 0px 10px 3px rgba(223,233,247,1.0);-o-box-shadow:0px 0px 10px 3px rgba(223,233,247,1.0);-ms-box-shadow:0px 0px 10px 3px rgba(223,233,247,1.0);}.nav{padding-left:0;margin-bottom:0;list-style:none;}.nav img{width:50px !important;height:50px !important;}.nav > ul{position:relative;z-index:1;height:52px;background:rgba(255,255,255,.85);list-style-image:none;list-style-type:none;margin:0px;padding:0px !important;}.nav ul li{position:relative;float:left;width:20%;text-align:center;margin:0px;padding:0px;list-style-image:none;list-style-type:none;top:0px;left:3%;}.nav ul li a{display:block;margin-right:auto;margin-left:auto;}}</style><div class="nav"><ul><li> <a href="https://www.juzihuang.com/"><img src="http://img1.wwwbaike.com/220901/1243335553-0.jpg" alt="网站移动端下方固定导航按钮的方法"></a> </li><li> <a href="https://www.juzihuang.com/jishu/"><img src="http://img1.wwwbaike.com/220901/12433322G-1.jpg" alt="网站移动端下方固定导航按钮的方法"></a> </li><li> <a href="https://www.juzihuang.com/ziyuan/"><img src="http://img1.wwwbaike.com/220901/1243331954-2.jpg" alt="网站移动端下方固定导航按钮的方法"></a> </li><li> <a href="https://www.juzihuang.com/shenmu/"><img style="animation: blink 1.0s linear infinite;" src="http://img1.wwwbaike.com/220901/1243331Z6-3.jpg" alt="网站移动端下方固定导航按钮的方法"></a> </li><li> <a href="https://www.juzihuang.com/doc/"><img src="http://img1.wwwbaike.com/220901/124333O56-4.jpg" alt="网站移动端下方固定导航按钮的方法"></a> </li></ul></div>使用方法
把该代码加入到网站首页模板中，该固定导航按钮将只展现在移动端首页。想要移动端全站展示，可以将以上代码添加到footer文件中。链接可自行替换，图片亦如此，替换修改成自己的即可。

网站移动端下方固定导航按钮的方法

推荐阅读

在秀米该咋上传视频

花生怎样去除红衣皮

猕猴桃苦了怎么回事

烟酰胺副作用

4步教你全方位提高雅思听力

婚姻观包括什么

高二暑假补课多久 2021年高二下学期还有暑假吗

第一部茶叶专著是哪本书

夏季易患暑湿感冒六药膳让你远离感冒

鬼灭之刃动漫观看顺序鬼灭之刃观影顺序