Menu
If you have the following element:
<span style="width:100px"></span>
and the css is:
span {width:50px!important;}
Is there a way I can get the inline-style value and ignore the css value?
Thanks
508
The use of inline CSS styles prevent the reuse of the styles anywhere else. The html markup of the page becomes hard to read for the naked eye. The inline CSS styles are hard to maintain and does not provide consistency since they are not stored in a single place.
As with any CSS declaration, inline styles are subject to inheritance. They can impact children if they declare an inheritable property. The inheritable color property affects any child element which doesn't explicitly declare the property itself. Aside from that, inline styles only have a local impact.
It works kind of counter-intuitively, so just to explain further: inline styles override internal CSS, and internal CSS overrides external CSS files, and external CSS files override browser defaults. One way to think about it is like layers. The “closer” the style is to the element, the higher precedence it has.
Inline CSS allows you to apply a unique style to one HTML element at a time. You assign CSS to a specific HTML element by using the style attribute with any CSS properties defined within it. In the following example, you can see how to describe CSS style properties for an HTML <p> element in the same line of code.
use element.style.width
sample:
$(function(){
alert($("span")[0].style.width);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
