可不可以改变 禁用的button按钮的样式

html-css026

可不可以改变 禁用的button按钮的样式,第1张

首先创建一个txt文件,修改后缀名:把.txt改为.html,用记事本打开添加如下代码:

打开浏览器,这是一个没有添加样式的button,外观不美观,而且在不同的浏览器下显示的外观是不一样的,所以我们要添加统一的样式!

CSS:style属性设置。如下代码所示:按钮的样式是不是好看多了,在其他浏览器也会一样的显示这个效果。

注:如果按钮样式比较少、样式只对该按钮有效,那么就可以用style属性。

如下图代码所示,该按钮样式比较多,这样写让代码不整洁,可阅读性差,那么怎么解决这个问题呢,这就要用style标签了!

CSS:<style type="text/css"></style>样式表。如下代码所示:

style标签里面表示的是一个样式表,我们所有的样式都可以写到标签中去。这段代码的意思是:凡是button标签都使用这个样式。

注:如果希望这个页面所有的按钮(button)都使用这个

CSS:<style type="text/css"></style>样式表 加 class属性。如下代码所示:

注意看到代码的变化,我们把 样式表中的  button{}改成了.ui_button{},然后在button标签里面加了class属性,这样做的意思是,这个button标签使用了名字为ui_button的样式。

注:这是开发中比较常用的添加样式的方式,我们可以对需要添加样式的按钮指定一个样式。

JS:通过javascript动态修改样式。如下代码所示:

很多适合我们需要动态的改变样式,比如用户提交个人信息的适合,为了避免用户多次点击提交按钮重复提交信息,我们可以在用户点击提交按钮之后,禁用按钮,并设置按钮字体的颜色为灰色。

JS:修改样式的其他方法:

obj.style.cssText = "color:#E1E1E1background-color:black"

cssText可以写多个样式样式属性。

如下面代码:

JS:修改样式的其他方法:

obj.setAttribute("class", "style2")

直接更改按钮标签的class属性,把指向名为ui_button的样式改为指向名为style2的样式。

如下面代码:

JS:修改样式的其他方法:

<link href="css1.css" rel="stylesheet" type="text/css" id="css"/>

obj.setAttribute("href","css2.css")

修改引用外部的样式表文件,这样就可以对整个页面的样式进行全部更新!

如下面代码:

关于JS的基础知识可以百度,这里先说第一种方法:禁用F12

$(document).keydown(function(){return key(arguments[0])})function key(e){var keynumif(window.event){keynum=e.keyCode}else if(e.which){keynum=e.which} if(keynum==123){window.close()return false}}

把以上代码加入到你任意的JS或使用如下写法写入到 header.php 中即可!

<script type="text/javascript">

$(document).keydown(function(){return key(arguments[0])})function key(e){var keynumif(window.event){keynum=e.keyCode}else if(e.which){keynum=e.which} if(keynum==123){window.close()return false}}

</script>

第一种方法还是可以从工具那里调出开发者工具,第二种方法:禁用开发者工具