When you starts coding in style sheet there are some conflicts,
To deal with the conflicts there are rules in cascading style sheet.
For example when two properties are applied on a single style sheet
then the property with more weight will be determined.
If this problem occurs in applying some rules which are overridden,
To deal with this problem !important
property is used.
An example with source code is given below.Hope you will enjoy it.
Example of !important
property
<
style
type
="
text/css
"
>
h5
{
color
:
red
!important ;
}
h5
{
color
:
blue
;
}
h5
{
color
:
green
;
}
<
/style
>
<
h5
>
Heading for example<
/h5
>
Output of above code
Heading for example.
Style Sheet Hierarchy
There are some source from which styles formations come.
A complete list is given below.
- Some browser's by-default settings
- Some styles settings by user.
- Some styles by external style sheet.
- Some styles by imported style sheet.
- Some styles by embedded style sheet.
- Some styles by inline styling
- Some style rule which is marked as !important by the author
- Some style rule which is marked as !important by the reader (user)
An example of Rule order
<
style
type
="
text/css
"
>
h5
{
color
:
red
;
border
:
2px solid red
;
padding
:
5px
;
}
h5
{
color
:
blue
;
border
:
2px solid blue
;
padding
:
5px
;
}
h5
{
color
:
green
;
border
:
2px solid green
;
padding
:
5px
;
}
<
/style
>
<
h5
>
Heading for example<
/h5
>
Output of above code
Heading for example.
Comment here
If you have any query, if you want to know something about any of technical course related to computer science field, if you have any suggestion about relevant to uploaded content or if you anything wrong here (any mistake in content) than please contact us. Keep in mind, comment should be according to community guidelines.