1. <!DOCTYPE HTML>
    <html>
    <head>
        <title>:target切换</title>
        <meta charset="utf-8" />
        <style>
            *{margin:0;padding: 0;}
            #tab li{float: left;list-style: none;width: 80px;height: 40px;line-height: 40px;cursor: pointer;text-align: center;}
            #container{position: relative;}
            #content1,#content2,#content3{width: 300px;padding:30px;position: absolute;top: 40px;left: 0;}
            #tab1,#content1{background-color: #ffcc00;}
            #tab2,#content2{background-color: #ff00cc;}
            #tab3,#content3{background-color: #00ccff;}
            :target{z-index:1}
            #content1 {z-index:1}
        </style>
    </head>
    <body>
    <h2>实现多标签页效果</h2>
    <ul id="tab">
        <li id="tab1">
           <a href="#content1">10元套餐</a></li>
        <li id="tab2"
           ><a href="#content2">30元套餐</a></li>
        <li id="tab3"
           ><a href="#content3">50元包月</a></li>
    </ul>
    <div id="container">
        <div id="content1" class="fade show">
            10元套餐详情：<br />&nbsp;每月套餐内拨打100分钟，超出部分2毛/分钟
        </div>
        <div id="content2" class="fade">
            30元套餐详情：<br />&nbsp;每月套餐内拨打300分钟，超出部分1.5毛/分钟
        </div>
        <div id="content3" class="fade">
            50元包月详情：<br />&nbsp;每月无限量随心打
        </div>
    </div>
    </body>
    </html>

  1.  

：target方法实现切换的更多相关文章

  1. call()和apply()方法（切换上下文）

    call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. apply方法: 语法:apply ...

  2. 【NX二次开发】切换模块的方法，切换到制图模块

    源码(NX12.0): Session theSession = NXOpen::Session::GetSession(); theSession->ApplicationSwitchImme ...

  3. Spring3.3 整合 Hibernate3、MyBatis3.2 配置多数据源/动态切换数据源 方法

    一.开篇 这里整合分别采用了Hibernate和MyBatis两大持久层框架,Hibernate主要完成增删改功能和一些单一的对象查询功能,MyBatis主要负责查询功能.所以在出来数据库方言的时候基 ...

  4. jquery mobile切换页面的几种方法

    jquery mobile切换页面的几种方法 - 不厚道青蛙之焦油潭 - 博客频道 - CSDN.NET jquery mobile切换页面的几种方法 分类: phonegap html5 2012- ...

  5. ubuntu中切换到root账号方法

    ubuntu如何切换到root用户身份? 前面小编分享了ubuntu怎么开启root用户,下面小编来分享如何切到到root用户 方法/步骤 按照下面的方式打开终端工具,或者使用终端工具的快捷键Ctrl ...

  6. Fragment与Fragment相互切换之间的生命周期方法

    Fragment 1 切换到 Fragment 2时生命周期变化 1.通过 add hide show 方式来切换 Fragment Fragment1 的生命周期变化为:onCreate().onC ...

  7. iOS:切换视图时,反向传递数据方法二：代理

    代理: 1.发送信息的控制器设置一个代理,并自定义一个代理的方法,用来传递数据 2.接受信息的控制器遵循发送信息的控制器的协议 3.接受信息的控制器设置发送信息的控制器的代理为自己self 4.接受信 ...

  8. Spring3.3 整合 Hibernate3、MyBatis3.2 配置多数据源/动态切换数据源方法

    一.开篇 这里整合分别采用了Hibernate和MyBatis两大持久层框架,Hibernate主要完成增删改功能和一些单一的对象查询功能,MyBatis主要负责查询功能.所以在出来数据库方言的时候基 ...

  9. jquery swiper3自定义切换效果的方法

    jquery swiper3自定义切换效果的方法 <pre> <div class="swiper-slide"> <div class=" ...

随机推荐

  1. CF1153F Serval and Bonus Problem

    Serval and Bonus Problem 1.转化为l=1,最后乘上l 2.对于一个方案,就是随便选择一个点,选在合法区间内的概率 3.对于本质相同的所有方案考虑在一起,贡献就是合法区间个数/ ...

  2. notepad问题汇总

    右键无法设置为默认打开方式:https://blog.csdn.net/jl1134069094/article/details/50749075

  3. 【洛谷P1060 开心的金明】

    题目描述 金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间他自己专用的很宽敞的房间.更让他高兴的是,妈妈昨天对他说:“你的房间需要购买哪些物品,怎么布置,你说了算,只要不超过NNN元钱就行”. ...

  4. ImageMagick 笔记： 索引颜色(index color)、锁定图层，透明 png 转 gif (保持清晰度)

    今天在处理一张 png 透明背景的图片,大小: 16KB, 尺寸: 400 x 300,用到一段代码,也许对以后有用. /** 带透明背景和阴影的png图片, 转换成 gif, [索引色] + [锁住 ...

  5. 第六篇-以隐式意图（Implicit Intent）呼叫系统服务

    一.新建一个layout5.xml,同样换为constriant模式. 二.拖动两个Button到预览界面,第一个按钮名字改为DISPLAY WEBPAGE,第二个按钮名字改为MAKE A CALL. ...

  6. go框架gin的使用

    我们在用http的时候一般都会用一些web框架来进行开发,gin就是这样的一个框架,它有哪些特点呢 一:gin特点 1.性能优秀2.基于官方的net/http的有限封装3.方便 灵活的中间件4.数据绑 ...

  7. java 打印水仙花数

    package cn.lijun.demo6; public class Test2 { public static void main(String[] args) { for(int i=100; ...

  8. php调用API支付接口 转至http://www.cnblogs.com/chaochao00o/p/6490463.html

    首先访问  https://charging.teegon.com/  注册账号, 找到开发配置   记下client_id和client_secret. 点击 天工开放平台 点击天工收银 点击  S ...

  9. IIS 错误：处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler”

    导致这种问题的原因是ASP.NET没有成功注册到IIS中,很有可能是先安装.Net Framework,然后安装IIS.为了避免此问题发生,要先安装IIS再安装.Net Framework. 解决方案 ...

  10. layui获取子集表单中的值，关闭父级弹窗

    js代码 var GetParams = function(url,bool) { try { if(bool){ var index = url.indexOf('?'); url = url.ma ...