A标签-一个按钮样式
该文件引用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>
<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标签-一个按钮样式的更多相关文章
- 输出字符串格式化/ Linq对数组操作 /一个按钮样式
textBox1.Text = dateTimePicker1.Value.ToString("yyyy-MM-dd HH:mm:ss"); , , , , , , , , , , ...
- 5、Semantic-UI之基础按钮样式
5.1 基础按钮样式 在Semantic-UI中定义了很多的按钮样式,可以通过class="ui button"来指定,也可以在class中指定颜色. 示例:定义基础按钮样式 ...
- Expression Blend4经验分享：制作一个简单的文字按钮样式
首先在Grid里放一个TextBlock,对象时间线窗口的结构树如下 右键点击grid,选择构成控件 会弹出构成控件的对话框,选择你要构成的控件类型,控件名称,控件样式存储位置 这里我们选择butto ...
- Expression Blend4经验分享：制作一个简单的图片按钮样式
这次分享如何做一个简单的图片按钮经验 在我的个人Silverlight网页上,有个Iphone手机的效果,其中用到大量的图片按钮 http://raimon.6.gwidc.com/Iphone/de ...
- Fixjs实践——标签、按钮控件
Fixjs介绍 Fixjs是一款javascript界面基础框架,主要为开发复杂组件提供底层的框架支持. Fixjs 0.3.0主要增加了文本显示类fixjs.text.TextField 支持的主要 ...
- element ui 的Notification通知如何加 a 标签和按钮，并弹多个
前言:工作中需要在页面右下角弹出很多个提醒框,提醒框上有一个可点击的a标签,并有一个按钮,同时还需要一次性关闭所有的弹出框.转载请注明出处:https://www.cnblogs.com/yuxiao ...
- 「HTML+CSS」--自定义按钮样式【002】
前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...
- iOS系列 基础篇 06 标签和按钮 (Label & Button)
iOS系列 基础篇 06 标签和按钮 (Label & Button) 目录: 标签控件 按钮控件 小结 标签和按钮是两个常用的控件,下面咱们逐一学习. 1. 标签控件 使用Single Vi ...
- 漂亮的CSS按钮样式集以及在线生成工具
以前我们制作一样带带阴影.圆角或3D感的按钮都需要用图片来制作,但CSS3出来后就可以不用图片了,由于是代码写的按钮样式,在Retina上浏览依然清晰美观.虽然不错,但我们写一个阴影+质感的按钮还是挺 ...
随机推荐
- 创建 Mac OS X 10.9 USB 安装盘
通过 App Store 下载最新的 OS X 10.9 在“应用程序”目录找到下载的 OS X 10.9 安装文件,选中并鼠标右键,菜单中选择“显示包内容” 弹出的 Finder 中进入 Conte ...
- MySQL的一些基本查询，创建存储过程等
常用的查询条件有1.比较:=,<,>,<=,>=,!=,<>,!>,!< 2.确定范围:between and,not bet ...
- Android: Type Method 'NewStringUTF' could not be resolved
编译一个最简单的Android NDK 例子(android-ndk-r8/samples/hello-jni)出现了错误信息:Type Method 'NewStringUTF' could n ...
- 一步一步深入spring(5)--使用基于注解的spring实现 AOP
1.要利用spring aop,至少需要添加以下jar包 使用spring需要的jarspring.jar .commons-logging.jar 使用切面编程(AOP)需要的jar aspectj ...
- RSA算法优化
RSA算法优化 大数乘法 模乗优化 剩余定理(孙子定理) RSA加解密 python的RSA计算优化 #-*- coding: utf-8 -*- ''' /********************* ...
- Linux centos7环境下安装JDK的步骤详解
Linux centos7环境下安装JDK的步骤详解 测试root用户下JAVA版本 输入命令: java –version 1.先到Oracle官网里下载好jdk,网址如下: http://ww ...
- mysql数据库 触发器简单实例
触发器(trigger):监视某种情况,并触发某种操作. 触发器创建语法四要素:1.监视地点(table) 2.监视事件(insert/update/delete) 3.触发时间(after/befo ...
- Js-Html 前端系列--页面撑开头尾
今天学习过程中,发现一个超实用的方法,就是当页面有尾部,但是内容又不多的情况下,让中间的内容把尾部撑到底部. <script type="text/javascript"&g ...
- Android JDK配置使支持Gradle更新，Maven安装
配置Maven 或执行Gradle更新等相关命令时出现以下错误时要重新配置JDK ERROR: JAVA_HOME is set to an invalid directory.JAVA_HOME = ...
- session fixation
转自:session fixation攻击 什么是session fixation攻击 Session fixation有人翻译成"Session完成攻击",实际上fixation ...