0, since saturation and lightness do not work, but 0% in hsl / hsla?

I tried a simple demo where I gave colors to elements in hsl . From all my experience I know that 0 (ZERO) in CSS without units. If you want to specify 0 as a value, you can leave the device.

This, however, is not like hsl / hsla . In both Chrome and Firefox, this results in an invalid property value .

The tangentially related question was this, but it contains the answer that zero should be singular, referring to spec.

Any error with hsla (0, 0%, 0%, 0), becoming hsla (0, 0, 0, 0)? (missing percent sign)

 hsl(0,0,0) // error hsl(0,0%,0) // error hsl(0,0,0%) // error 

Is it specifically designed to work with units near zero? Are there any other properties like this when a zero unit is mandatory?

+5
source share
3 answers

A 0 <length> in CSS is not a unit, not 0, otherwise an ambiguity value would be impossible (for example, abbreviated). This is <percent>, not a <length>.

Specification:

+2
source

in general, hsl is a concept for defining a color other than CSS;

Three parameters you can set: H ue S aturation L.

  • Hue Think of a color wheel. Setting the value is similar to setting the degree of the angle.
    How an HSL-CSS value is a single value; negative negative (i.e. 360 == -720).

  • Saturation - 0% is completely denatured (in shades of gray). 100% fully saturated (full color).
    As a HSL-CSS value, a percentage value is needed (you can specify any% value, but a range from 0% to 100%).

  • Lightness - 0% completely dark (black). 100% completely light (white). 50% - medium lightness.
    As an HSL-CSS value, you have the same rule as saturation.

  • an optional alpha value is a value form from 0 to 1 that determines the opacity of the color.

here is a link to a good article for more information.


EDIT:

You believe that the color property can be set to a length value -% unit is incorrect - like other CSS properties that allow only a certain range of color values, it has its own parameters ( hsl - one); when the parser gets the value hsl or hsla , the rules are higher (probably in the future the parser will fix it for you, but at the moment this is how it works;)

+1
source

I do not know why 0% differs from 0. This does not explain why 0 in some cases differs from 0, and in other cases not.

0
source

Source: https://habr.com/ru/post/1233332/


All Articles