Is background-color:none valid CSS?
CssBackground ColorCss Problem Overview
Can anyone tell me if the following CSS is valid?
.class {
background-color:none;
}
Css Solutions
Solution 1 - Css
You probably want transparent as none is not a valid background-color value.
The CSS 2.1 spec states the following for the background-color property:
> Value: <color> | transparent | inherit
<color> can be either a keyword or a numerical representation of a colour. Valid color keywords are:
> aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, > orange, purple, red, silver, teal, white, and yellow
transparent and inherit are valid keywords in their own right, but none is not.
Solution 2 - Css
No, use transparent instead none . See working example here in this example if you will change transparent to none it will not work
use like .class { background-color:transparent; }
Where .class is what you will name your transparent class.
Solution 3 - Css
The answer is no.
Incorrect
.class {
background-color: none; /* do not do this */
}
Correct
.class {
background-color: transparent;
}
background-color: transparent accomplishes the same thing what you wanted to do with background-color: none.
Solution 4 - Css
CSS Level 3 specifies the unset property value. From MDN:
> The unset CSS keyword is the combination of the initial and inherit > keywords. Like these two other CSS-wide keywords, it can be applied to > any CSS property, including the CSS shorthand all. This keyword resets > the property to its inherited value if it inherits from its parent or > to its initial value if not. In other words, it behaves like the > inherit keyword in the first case and like the initial keyword in the > second case.
Unfortunately this value is currently not supported in all browsers, including IE, Safari and Opera. I suggest using transparent for the time being.
Solution 5 - Css
.class {
background-color:none;
}
This is not a valid property. W3C validator will display following error:
> Value Error : background-color none is not a background-color value : none
transparent may have been selected as better term instead of 0 or none values during the development of specification of CSS.
Solution 6 - Css
write this:
.class {
background-color:transparent;
}
Solution 7 - Css
So, I would like to explain the scenario where I had to make use of this solution. Basically, I wanted to undo the background-color attribute set by another CSS. The expected end result was to make it look as though the original CSS had never applied the background-color attribute . Setting background-color:transparent; made that effective.