Question

您好我在HTML5的head标签中有多个样式标签。如何从该样式列表中删除特定标签.Below是我需要使用的代码。我需要高度为50px的样式标签或从该标签中删除样式高度：50px。我该怎么办？

<html>
<head>
    <style>p:hover{color:red;background: red;}</style>
    <style>p:hover{color:yellow;height:50px}</style>'
</head>    
<body>
<p>HELLO</p>
</body>
</html>

Answer 1

看看JQuery。 Jquery中的CSS API允许动态地向元素添加和删除css属性。 http://api.jquery.com/css/

Answer 2

样式按照呈现给浏览器的顺序加载。如果你声明一个样式两次，那么第二个将总是覆盖第一个带有!important属性的UNLESS。

例如：

p:hover {
   height: 50px;
}

p:hover {
   height: auto !important; /* this will win */
}

p:hover {
   height: 100px;
}

在您的情况下，只有当您试图覆盖现有的样式时，才需要！important。由于某些未明确的原因，它只是不适合您。

Answer 3

要在鼠标悬停时更改背景颜色，您可以使用http://jquery.com/进行此操作您也可以通过更改来更改元素的高度或高度 $(this).css("background-color", "red");由'$（this）.css（“height”，“50px”）;'

以下是一个示例：http://jsfiddle.net/M4ULF/

<强> CSS

#my_id{
    height:50px;
    width:50px;
    background-color:#999; 
}

<强> HTML

<p id="my_id"></p>

JAVASCRIPT（jQuery）

$("#my_id").mouseover(function(){
    $(this).css("background-color", "red");
})
$("#my_id").mouseout(function(){
    $(this).css("background-color", "#999");
})

Answer 4

您可以指定元素的样式属性，该属性将覆盖元素或类样式。

或者，将类添加到P标记中，其中类具有样式。该类将覆盖元素样式。

Answer 5

我宁愿用您显示的新规则覆盖CSS：

p:hover{height:auto}

Example

但也可以通过JS删除height属性。假设页面看起来与问题相同，则代码为：

document.styleSheets[1].rules[0].style.removeProperty("height")

Example

您可以阅读CSS DOM API over here。

从动态删除样式？

5 个答案: