效果:

html:

JS:

css:

.tabs-two{
.two{
display: inline-block;
font-size:14px;
height: 17px;
font-weight:300;
color:#444444;
margin-top:10px;
height:26px;
text-align: center;
line-height: 26px;
border-radius:2px;
cursor: pointer;
 
}
.two:hover{
background:rgba(252,69,48,1);
color:#fff;
}
.newreply{
margin-left:17px;
width:76px;
 
}
.waitreply{
margin-left:6px;
width:62px;
}
.overreply{
margin-left:8px;
width:62px;
}
.checked{
background:rgba(252,69,48,1);
color:#fff;
}
}

js-点击tab按钮,同一页面显示不同的内容的更多相关文章

  1. PHP——0128练习相关2——js点击button按钮跳转到另一个新页面

    js点击button按钮跳转到另一个新页面 投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论 点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么 ...

  2. ASP.NET防止连续多次点击提交按钮 导致页面重复提交

    PS:实际使用中发现,第①种方法在火狐浏览中有时候有问题.第2种方法,在各个浏览器中都没问题 近做项目遇到了这样的情况: 公司网络比平常慢了不少,在点击保存按钮提交页面后需等待挺长的一段时间,忍不住手 ...

  3. 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还

    查看本章节 查看作业目录 需求说明: 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他 ...

  4. 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  5. H5点击不同按钮跳转显示不同分页

    预期效果(页面1): 点击后显示对应的内容(页面2): HTML(页面1): 添加 onclick 跟 data-index     <!-- 3我的订单 -->     <div ...

  6. JS 点击复制按钮 将文字复制到手机剪贴板

    我们在制作移动端网页的时候,经常会遇到这样一个问题,如何点击一个"复制"按钮,把一串文字复制到手机剪贴板,如上图所示. 看了网上的一些方法后,感觉那些方法都太复杂,有点要用插件,有 ...

  7. 点击Button按钮实现页面跳转

    1.首先我们新建一个带有button按钮的页面 <button type="submit" class="form-contrpl">注册</ ...

  8. js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

    点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...

  9. js点击button按钮跳转到页面代码

    点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...

随机推荐

  1. Java中File类的基本用法

    File类的基本用法 java.io.File类:代表文件和目录.在开发中,读取文件.生成文件.删除文件.修改文件的属性时经常会用到此类. File类的常用构造方法:public File(Strin ...

  2. 微信小程序开发(二)----- 云开发

    1.概念 微信小程序的云开发是腾讯云与微信团队深度合作推出的一个全新的小程序的解决方案,它提供了云函数.云数据库与云存储这三大基础能力支持,随着云开发的出现,小程序的开发者可以将服务端的部署和运营的环 ...

  3. C++的左值,右值,左值引用,右值引用

    参考大神链接: https://blog.csdn.net/u012198575/article/details/83142419 1.左值与右值 https://msdn.microsoft.com ...

  4. numpy-tile 数组复制

    tile(A, reps):把数组A复制成新数组 # 把 矩阵 看做一个整体,第二个参数代表把 矩阵 复制 m*n 次 b = np.arange(1, 5).reshape(2, 2) print( ...

  5. 字符集详解 ASCII码、Unicode、UTF-8 (转)

    认识字符集 对于计算机而言,它仅认识两个0和1,不管是在内存中还是外部存储设备上,我们所看到的文字.图片.视频等等“数据”在计算机中都是已二进制形式存在的.不同字符对应二进制数的规则,就是字符的编码. ...

  6. Node.js FS模块方法速查

    1. File System 所有文件操作提供同步和异步的两种方式,本笔记只记录异步的API 异步方式其最后一个参数是回调函数.回调函数的第一个参数往往是错误对象,如果没有发生参数,那么第一个参数可能 ...

  7. 19.AutoMapper 之开放式泛型(Open Generics)

    https://www.jianshu.com/p/ce4c7e291408 开放式泛型(Open Generics) AutoMapper可以支持开放式泛型的映射.为开放式泛型创建映射: publi ...

  8. 求x到y的最少计算次数 (BFS)

    时间限制:1秒 空间限制:262144K 给定两个-100到100的整数x和y,对x只能进行加1,减1,乘2操作,问最少对x进行几次操作能得到y? 例如:a=3,b=11: 可以通过3*2*2-1,3 ...

  9. wpf prism加载独立模块实例

    一.首先看看文件的组织架构 module1 module2生成dll某块.Shell来显示管理模块 二,看看关键bootstrapper类 using System;using System.Coll ...

  10. vim 文本编辑器

    vim 文件名:命令模式 i 编辑模式 :输入模式 vim +n 文件名:打开文件,将光标置于第N行首部 命令模式进入输入模式进行编辑: i 当前光标位置插入文本 I 在当前行行首插入文本 o 在光标 ...