Is it possible to combine inline css and freeze state?

I found out that if we write inline css (or add it using JavaScript), we will lose the css hover value. Can this behavior be changed?

Simple example


<div id="test" style="color: red">test</div>
<style>
#test:hover {
    color:blue;
}
</style>

In this case, the hang does not work.

Update

I can’t use it !important, because after it I can’t change this attribute using JavaScript.

I also generate styles dynamically, so I cannot add specific classes through JavaScript.

+3
source share
4 answers

because inline css overrides your css styles in the file if you have

color: blue !important

it will work, but not recommended, you can always use jquery to remove the inline style tag, although haha

Update:

jquery javascript... ! , css

+3

! , javascript.

!important, JavaScript .

+3

-

$(selector).hover(function() {
                $st = $(this).attr("style");
                $(this).attr("style","");
            },function() {
                $(this).attr("style",$st);
            });
+2

CSS style style stylesheets. style, !important. style style. , stylesheet .

P.S. type style. , <style> <style type="text/css">

0

All Articles