html底部导航栏切换页面

内容一：

1.每个页面该标签位置一样，看的效果就是标签没动，下面内容变了。

2.下面通过ifram展示，点击标签改变iframe地址。

3.下面东西在点击后去动态请求。（请求数据，然后通过模板渲染。或者直接请求里面的html，css，js然后再往页面里面塞）。

内容二：

1. 保存需要用到的图片

2. 先给导航块的a标签设置img属性和data-img属性；img属性为未选中图片，data-img为选中图片。第一个按钮的img图片应设置为默认选中的状态。以下为html部分

3. JavaScript部分//点击每个按钮后进行按钮切换图片操作$(".tab-bar-item").on("click",function(){//先constclickImg变量为他的data属性（选中图片），然后找到img图片的src属性将未选中的图片点击后替换为选中图片constclickImg=$(this).data("img");$(this).find("img").attr("src",clickImg);//找到被点击标签的其他兄弟标签，用each遍历constnoclick为未选中的img图片，将点击标签的其他兄弟标签的img换为未选中图片就可以了$(this).siblings().each(function(){constnoclickImg=$(this).attr("img")$(this).find("img").attr("src",noclickImg);})}

内容三：

1、直接使用html5中的导航栏标签【】；

2、可以无序列表，去除默认样式设置浮动就可以；

3、设置超链接。