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 ...
随机推荐
- Windows如何正确的修改administrator用户名
无论是服务器还是电脑.修改默认的administrator的用户总是好的.话不多少.直接上图 1.win+r 输入:gpedit.msc 2.按照我下图的圈圈找到重命名系统管理员账户并自定义 3.重 ...
- BZOJ 2096: [Poi2010]Pilots 单调队列
Code: #include<bits/stdc++.h> #define maxn 4000000 using namespace std; void setIO(string s) { ...
- python tkinter模块 创建窗口V1.2
先上图 代码如下 #-*-coding:utf-8-*- import os from tkinter import * root=Tk() root.title('执行窗口') "&quo ...
- Win32 线程同步
Win32 线程同步 ## Win32线程同步 ### 1. 原子锁 ### 2. 临界区 {全局变量} CRITICAL_SECTION CS = {0}; // 定义并初始化临界区结构体变量 {线 ...
- uva 1587(Box UVA - 1587)
题目大意是给定6个数对,每个数对代表一个面的长和宽,判断这6个面是否能构成一个长方体. 这种题一看很复杂,但是只要不想多了实际上这就是一个水题... 首先说明一下判断的思路: 1.长方体是有三个对面的 ...
- =、==、is、id(内容)
= 赋值 == 比较值是否相等 is 比较.比较的是内存地址 id(内容) 测出内存地址
- ASP.NET误人子弟教程:在MVC下如何返回图片
这几天忙着一些小事,也没有写什么了,今天,我们来玩一个比较简单的东东.就是在MVC下如何返回图片,相信,在传统WebForm下,大家都晓得怎么弄,方也不限于一种,但是,在架构较为严格的MVC里面,刚开 ...
- Tornado初学
http://datacademy.io/course 1.资源链接:http://demo.pythoner.com/itt2zh/index.html 2.windows中调用curl 方法:安装 ...
- hdu_1008_Elevator_201308191629
ElevatorTime Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Sub ...
- 【ACM】nyoj_6_喷水装置(1)_201308150853
喷水装置(一)时间限制:3000 ms | 内存限制:65535 KB 难度:3描述 现有一块草坪,长为20米,宽为2米,要在横中心线上放置半径为Ri的喷水装置,每个喷水装置的效果都会让以它为中心 ...