css样式中遇到!important

html-css020

css样式中遇到!important,第1张

1、新建一个html代码页面。

2、创建一个input按钮标签,然后给这个按钮添加一个changeBg()的点击事件。

代码:<input type="button"   value="点击切换背景色" onclick="changeBg()"/>

3、创建style标签,然后创建一个class类为btn用于设置按钮样式,其中按钮的背景设置background-color:#009F95!important

代码:

<style type="text/css">

.btn{

border:1pxsolid#ddd

padding:5px8px

background-color:#009F95!important

}

</style>

4、给按钮input标签添加class="btn"。

代码:<input type="button" class="btn"  value="点击切换背景色" onclick="changeBg()"/>

5、引入jquery库,然后新建一个script标签,在这个标签里为changeBg()点击事件添加修改按钮的背景色。

changeBg()修改背景色代码:

functionchangeBg(){

$(".btn").css("cssText","background-color:red!important")

}

6、保存html代码页面后使用浏览器打开,点击按钮后发现按钮背景色被修改为红色。

如果是bg.css里面的话,

body {

background-image: url(1.jpg)

background-repeat: no-repeat

background-color: #000000

}

这些代码就可以了。

首先检查是不是存在用法错误或者拼写错误,正确的css设置背景的方法如下:

<html>

<head>

<title>背景颜色实例</title>

</head>

<body>

<style type="text/css">

.bg{ width: 100px height: 100px background-color: red}

</style>

<div class="bg"></div>

</body>

</html>

设置了一个长宽均为100px,背景为红色的div