background none vs background transparent what is the difference

Question

Is there a difference between these two CSS properties   background  none  background  transparent     Are they both valid  Which one should be used and why

User · Answer

To complement the other answers  if you want to reset all background properties to their initial value  which includes background-color  transparent and background-image  none  without explicitly specifying any value such as transparent or none  you can do so by writing   background  initial

User · Answer

There is no difference between them   If you don t specify a value for any of the half-dozen properties that background is a shorthand for  then it is set to its default value  none and transparent are the defaults   One explicitly sets the background-image to none and implicitly sets the background-color to transparent  The other is the other way around

User · Answer

As aditional information on  Quentin answer  and as he rightly says  background CSS property itself  is a shorthand for  background-color background-image background-repeat background-attachment background-position  That s mean  you can group all styles in one  like  background  red url    img jpg  0 0 no-repeat fixed   This would be  in this example   background-color  red  background-image  url    img jpg   background-repeat  no-repeat  background-attachment  fixed  background-position  0 0   So    when you set  background none  you are saying that all the background properties are set to none    You are saying that background-image  none  and all the others to the initial state  as they are not being declared   So  background none  is  background-color  initial  background-image  none  background-repeat  initial  background-attachment  initial  background-position  initial   Now  when you define only the color  in your case transparent  then you are basically saying  background-color  transparent  background-image  initial  background-repeat  initial  background-attachment  initial  background-position  initial   I repeat  as  Quentin rightly says the default transparent and none values in this case are the same  so in your example and for your original question  No  there s no difference between them  But    if you say background none Vs background red then yes    there s a big diference  as I say  the first would set all properties to none default and the second one  will only change the color and remains the rest in his default state  So in brief  Short answer  No  there s no difference at all  in your example and orginal question  Long answer  Yes  there s a big difference  but depends directly on the properties granted to attribute   Upd1  Initial value  aka default  Initial value the concatenation of the initial values of its longhand properties  background-image  none background-position  0  0  background-size  auto auto background-repeat  repeat background-origin  padding-box background-style  is itself a shorthand  its initial value is the concatenation of its own longhand properties background-clip  border-box background-color  transparent  See more background descriptions here  Upd2  Clarify better the background none  specification

[css] background:none vs background:transparent what is the difference?

Examples related to css

Examples related to background