input点击修改样式
<input id="geren" type="button" value="个人奖励" style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none;width:48%">
<input id="bumen" type="button" value="部门奖励" style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none;width:48%">
两个input 点击触发查事件并加入新的样式
<style>
/**
加下划线
*/ .xiahua
{
BORDER-BOTTOM-STYLE: solid !important;
} /*.noxiahua*/
/*{*/
/*BORDER-BOTTOM-STYLE: none !important;*/
/*}*/ </style>
加入代码添加样式
<script>
$("#bumen").click(function(){
$("#bumen").addClass("xiahua");
$("#geren").removeClass("xiahua");
$.ajax({
type:"post",
url:"/selectOneselectOnejian.do",
success:function(data){
if(data.success){
for(var i = ; i<data.data.length;i++){
$("#ge").empty();
$('#ge').append("<h5><span style=' style='color: #282828''>用户:</span>"+data.data[i].jiali+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>记录:</span>"+data.data[i].content+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>积分:</span>"+data.data[i].jifen+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>时间:</span>"+data.data[i].time+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"</div>"+
"<hr style='height:1px;border:none;border-top:1px solid #282828;'/>"
);
}
}else{
$("#ge").empty();
$('#ge').append("<h5><span style=' style='color: #282828''>无记录</span></h5>" );
}
},
error:function(){}
}) }) </script> <script>
$("#geren").click(function(){
//$("#bumen").addClass("noxiahua");
$("#bumen").removeClass("xiahua");
$("#geren").addClass("xiahua");
$("#ge").empty();
$.ajax({
type:"post",
url:"/selectOnejiangli.do",
success:function(data){
if(data.success){
$("#ge").empty();
for(var i = ; i<data.data.length;i++){
$('#ge').append("<h5><span style=' style='color: #282828''>用户:</span>"+data.data[i].jiali+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>记录:</span>"+data.data[i].content+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>积分:</span>"+data.data[i].jifen+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"<h5><span style=' style='color: #282828''>时间:</span>"+data.data[i].time+"</h5>" +
"<div class='mui-input-row mui-password'>" +
"</div>" +
"</div>"+
"<hr style='height:1px;border:none;border-top:1px solid #282828;'/>"
);
}
}else{
$("#ge").empty();
$('#ge').append("<h5><span style=' style='color: #282828''>无记录</span></h5>" );
}
},
error:function(){}
}) })
</script>
一、语法
选择器{样式:值!import;}
二、说明
提升指定样式规则的应用优先权,即!important为开发者提供了一个增加样式权重的方法,让浏览器首选执行这个语句。
例如下面这个样式:
.xiahua
{
BORDER-BOTTOM-STYLE: solid !important;
}
如果是在除了IE6的浏览器中,这些浏览器支持!important属性,也就是说他们会默认让margin-left:20px!important; 这条语句生效,下面的不带!important声明的样式将不会覆盖它,换句话说就是他的级别最高,下面的人都不能取代我!
在IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效。请看下述代码:
div {
margin-left:20px!important;
}
div {
margin-left:40px;
}
在上述代码中,IE6及以下浏览器中div的margin-left与其它浏览器一致,都为20px;
注意:
1、IE6及更早浏览器下,!important在同一条规则集内不生效。
2、如果!important被用于一个简写的样式属性,那么这条简写的样式属性所代表的子属性都会被作用上!important。
3、关键字!important必须放在一行样式的末尾并且要放在该行分号前,否则就没有效果。
input点击修改样式的更多相关文章
- vue 点击修改样式
1.页面加载默认一个初始的isact,让第二个div.f具有一个on的类:在点击的时候,传入一个值给data.isact <template> <nav class="cl ...
- 对input type=file 修改样式
效果图先给: 在html中涉及到文件选择的问题,文件选择使用 input(class="filter_input form-control" type="file) 但是 ...
- 使用<label>标签修改input[type="checkbox"]的样式
因为<label>的特性有两点 : ①不呈现任何效果, ②用户点击该标签, 浏览器能自动将焦点转移到相关的表单控件上. <form> <input type=" ...
- input选择框默认样式修改
input选择框是无法直接修改样式,我们只能间接来改变它样式. 原理:用图片来代替原来的input选择框,原来的input选择框定位到图片上方并让它opacity为0,鼠标点击时用js来改变图片,这样 ...
- 修改input属性placeholder的样式
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 用javascript在客户端删除某一个cookie键值对 input点击链接另一个页面,各种操作。 C# 往线程里传参数的方法总结 TCP/IP 协议 用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图 (转)值得学习百度开源70+项目
ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 我们都知道在使用WebApi的时候Controller会自动将Action的返回值自动进行各种序列化处理(序列化为 ...
- 微信小程序弹框wx.showModal如何修改样式
由于官方API提供的显示模态弹窗,只能简单地显示文字内容,不能对对话框内容进行自定义,欠缺灵活性,所以自己从模态弹窗的原理角度来实现了自定义的模态对话框. wx.showModal修改样式后的效果,如 ...
- js实现点击修改按钮之后单元格变成可编辑状态
主要实现原理: 每一行有一个修改按钮 点击修改之后,获取行对象,通过行对象再获取行中单元格数组.然后把每一个单元格中的innerHTML替换成input输入框,并赋值value=原来单元格中的内容,鼠 ...
- 自定义input[type="radio"]的样式
对于表单,input[type="radio"] 的样式总是不那么友好,在不同的浏览器中表现不一. 为了最大程度的显示出它们的差别,并且为了好看,首先定义了一些样式: <fo ...
随机推荐
- 关于在win7旗舰版32位上 安装 net4.0 的闪退问题研究 和安装sqlserver2008问题
1.配置文件客户端[目标x86x64]的 可以安装 2.配置文件完全的目标x86x64的 出现闪退. 3.服务器核心的出现无法安装 安装 sqlserver 2008R2数据库 报错 \最后留下了它, ...
- python dns请求
一.DNS dns(domain name system)域名系统 ,主要用来把主机名转换成ip地址.其至今能存在的原因有两个: 能使人们记住名字,而不是ip地址: 允许服务器改变地址,但使用相同的名 ...
- STL中队列queue的用法
头文件:#include <queue> 建立一个队列queue < 类型 > q 加入一个新的元素q.push(a) 询问队首元素q.front() 弹出队首元素q.pop( ...
- 20180429NOIP提高组精英班Day1测试
- NOIP2018 滚粗记
Day -2 上午,大家都在复习各种模板,zhx总结了足足67个模板(杨辉三角也算模板???),lgl死磕FFT发现cos和sin打反了,我也是复习板子和以前做过的题,几乎没有人颓. 接着jdr,l ...
- copy the content of a file muliptle times and save as ordered files:
input: transient.case outputs: transient_1.case, transient_2.case,...transient_101.case ********** n ...
- LINUX 查看硬件配置命令
系统 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /proc/cpuinfo # 查看CPU信息 # ...
- 从零搭建流媒体服务器+obs推流直播
背景介绍 本文使用的流媒体服务器的搭建是基于rtmp(Real Time Message Protocol)协议的,rtmp协议是应用层的协议,要依靠底层的传输层协议,比如tcp协议来保证信息传输的可 ...
- 有用的生活有关的website
1. 如何快速download mpa3 from youtube a. google "youtube download" 2. 打开https://y2mate.com 3. ...
- mbr gpt
超过2T硬盘的磁盘要用gpt格式,准确地说,应该是分区超过2T地硬盘要选用GPT模式. 做个小推广:程序员经常久坐,颈椎毛病比较多,特别推荐ventry颈椎保健枕