该文件引用jquery-1.11.3.js库
<!doctype html>

<html>

<head>

    <meta charset="UTF-8">

    <title>A标签样式</title>

    <style>

        .sel_btn{

            height: 21px;

            line-height: 21px;

            padding: 0 11px;

            background: #02bafa;

            border: 1px #26bbdb solid;

            border-radius: 3px;

            /*color: #fff;*/

            display: inline-block;

            text-decoration: none;

            font-size: 12px;

            outline: none;

        }

        .ch_cls{

            background: #e4e4e4;

        }

    </style>

    <script type="text/javascript" src="jquery-1.11.3.js"></script>

</head>

<body>

    &nbsp;&nbsp;&nbsp;&nbsp;

    <a class="sel_btn ch_cls" id="sel_btn1" href="#" onclick="changeSelBtn(1)">全天</a>

    <a class="sel_btn" id="sel_btn2" href="#" onclick="changeSelBtn(2)">上午</a>

    <a class="sel_btn" id="sel_btn3" href="#" onclick="changeSelBtn(3)">下午</a>

    <hr>

    <script type="text/javascript">

         function changeSelBtn(index){

            if(index==1){

                $("#sel_btn1").addClass('ch_cls');

                $("#sel_btn2").removeClass('ch_cls');

                $("#sel_btn3").removeClass('ch_cls');

            }else if(index==2){

                $("#sel_btn1").removeClass('ch_cls');

                $("#sel_btn2").addClass('ch_cls');

                $("#sel_btn3").removeClass('ch_cls');

            }else if(index==3){

                $("#sel_btn1").removeClass('ch_cls');

                $("#sel_btn2").removeClass('ch_cls');

                $("#sel_btn3").addClass('ch_cls');

            }

         }

    </script>

</body>

</html>

效果：

A标签-一个按钮样式的更多相关文章

  1. 输出字符串格式化/ Linq对数组操作 /一个按钮样式

    textBox1.Text = dateTimePicker1.Value.ToString("yyyy-MM-dd HH:mm:ss"); , , , , , , , , , , ...

  2. 5、Semantic-UI之基础按钮样式

    5.1 基础按钮样式   在Semantic-UI中定义了很多的按钮样式,可以通过class="ui button"来指定,也可以在class中指定颜色. 示例:定义基础按钮样式 ...

  3. Expression Blend4经验分享：制作一个简单的文字按钮样式

    首先在Grid里放一个TextBlock,对象时间线窗口的结构树如下 右键点击grid,选择构成控件 会弹出构成控件的对话框,选择你要构成的控件类型,控件名称,控件样式存储位置 这里我们选择butto ...

  4. Expression Blend4经验分享：制作一个简单的图片按钮样式

    这次分享如何做一个简单的图片按钮经验 在我的个人Silverlight网页上,有个Iphone手机的效果,其中用到大量的图片按钮 http://raimon.6.gwidc.com/Iphone/de ...

  5. Fixjs实践——标签、按钮控件

    Fixjs介绍 Fixjs是一款javascript界面基础框架,主要为开发复杂组件提供底层的框架支持. Fixjs 0.3.0主要增加了文本显示类fixjs.text.TextField 支持的主要 ...

  6. element ui 的Notification通知如何加 a 标签和按钮，并弹多个

    前言:工作中需要在页面右下角弹出很多个提醒框,提醒框上有一个可点击的a标签,并有一个按钮,同时还需要一次性关闭所有的弹出框.转载请注明出处:https://www.cnblogs.com/yuxiao ...

  7. 「HTML+CSS」--自定义按钮样式【002】

    前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...

  8. iOS系列 基础篇 06 标签和按钮 (Label & Button)

    iOS系列 基础篇 06 标签和按钮 (Label & Button) 目录: 标签控件 按钮控件 小结 标签和按钮是两个常用的控件,下面咱们逐一学习. 1. 标签控件 使用Single Vi ...

  9. 漂亮的CSS按钮样式集以及在线生成工具

    以前我们制作一样带带阴影.圆角或3D感的按钮都需要用图片来制作,但CSS3出来后就可以不用图片了,由于是代码写的按钮样式,在Retina上浏览依然清晰美观.虽然不错,但我们写一个阴影+质感的按钮还是挺 ...

随机推荐

  1. JAVA多线程经典问题 -- 生产者 消费者

    工作2年多来一直也没有计划写自己的技术博客,最近辞职在家翻看<thingking in JAVA>,偶尔看到了生产者与消费者的一个经典的多线程同步问题.本人在工作中很少使用到多线程以及高并 ...

  2. Supervisor 管理后台守护进程

    Supervisor 管理后台守护进程 参考原文如下: http://codinn.com/people/brant/notes/110948/ 做了一些注释 +++++++++++引用开始+++++ ...

  3. git的初步使用---本地代码库的使用和提交

    git的初步使用---本地代码库的使用和提交 git是一个好东西,但对于新手来说,这个工具并不好使用,因为它里面涉及到很多东西,而这些东西新手一时间是无法理解的.不幸的是,本人就是新手一枚,所以,这里 ...

  4. Httphelper工具1

    [苏飞开发助手V1.0测试版]官方教程与升级报告导读部分------------------------------------------------------------------------ ...

  5. 绩效考核指标KPI 听课笔记

    以前一直听人在说KPI,今天终于明白KPI是什么意思了!

  6. 巧用final

    1.final可以修饰函数的参数,以防止函数内部随意篡改不允许修改的参数. 2.在函数内部,把函数的局部变量声明为final类型,可以检查在函数内部它们是否的确只被赋值一次.

  7. tensorflow与kubernetes/docker结合使用实践

    tensorflow tensorflow是谷歌基于DistBelief进行研发的第二代人工智能学习系统,其命名来源于本身的运行原理.Tensor(张量)意味着N维数组,Flow(流)意味着基于数据流 ...

  8. 开发一个微信小程序项目教程

    一.注册小程序账号 1.进入微信公众平台(https://mp.weixin.qq.com/),注册小程序账号,根据提示填写对应的信息即可.2.注册成功后进入首页,在 小程序发布流程->小程序开 ...

  9. MySQL 性能优化神器 Explain 使用分析

    简介 MySQL 提供了一个 EXPLAIN 命令, 它可以对 SELECT 语句进行分析, 并输出 SELECT 执行的详细信息, 以供开发人员针对性优化. EXPLAIN 命令用法十分简单, 在 ...

  10. 用C++实现的元胞自动机

    我是一个C++初学者,控制台实现了一个元胞自动机. 代码如下: //"生命游戏"V1.0 //李国良于2017年1月1日编写完成 #include <iostream> ...