css 中hsl颜色的意义
Introduction:
介绍：
It is no wonder that we can make use of various CSS functions to ease our coding and shorter our coding. Instead of writing long lethargic codes we can simply make use of functions and avoid writing those codes. Besides, it is considered good practice to make use of functions while developing a website or webpage as it shows how much you know about web development, it represents your knowledge regarding coding skills as well as how you can optimize your code. So, learn as much as functions as you can and never forget to implement them in your code just like any professional coder.
难怪我们可以利用各种CSS函数来简化我们的编码并缩短我们的编码。 除了编写冗长的昏昏欲睡的代码，我们可以简单地使用函数，而避免编写那些代码。 此外，在开发网站或网页时使用功能被认为是一种好习惯，因为它显示了您对Web开发的了解程度，代表了您对编码技能的了解以及如何优化代码。 因此，尽可能多地学习功能，并且永远不要忘记像任何专业编码员一样在代码中实现它们。
Definition:
定义：
Now, that we are familiar with why various functions are important and how they can be implemented in our code. So why don’t we take this discussion further and learn more about a very specific function called hsl() function? This function is very beneficial for your code, so let us understand this function in detail by looking at its definition and its usage. The hsl() function is mainly used for providing color values when it is used in CSS. With the help of this function, you can specify specific color values by specifying the hue, saturation, and even light component of colors. Well, you would be amazed to know that the full form of HSL is "Hue Saturation Lightness", which is nothing but the representation of the RGB color space of computer graphics.
现在，我们熟悉了为什么各种功能很重要以及如何在我们的代码中实现它们。 那么，为什么不进一步讨论并进一步了解称为hsl()函数的非常具体的函数呢？ 该功能对您的代码非常有益，因此，让我们通过查看其定义和用法来详细了解此功能。 hsl()函数在CSS中使用时主要用于提供颜色值。 借助此功能，您可以通过指定颜色的色相，饱和度甚至光分量来指定特定的颜色值。 好吧，您会惊奇地知道， HSL的完整形式是“色相饱和度亮度” ，它不过是计算机图形学RGB颜色空间的表示。
Well, let us have a look at the syntax of this function,
好吧，让我们看一下这个函数的语法，
Syntax:
句法：
element{
color : hsl(hue,saturation,lightness);
}
Values:
值：
Let us understand each of these values one by one,
让我们一一理解这些价值观，
HUE: Hue is a container that lets you set the color from a color wheel.
HUE：色调是一个容器，可以让您设置一个色轮的色彩。
SATURATION: Saturation, as the name suggests, specifies the saturation of the color. It is determined within a percent.
饱和度 ：饱和度，顾名思义，指定颜色的饱和度。 确定在一个百分比之内。
LIGHTNESS: Lightness is not that tough to understand, it is used to set the lightness of the color. It is also determined within a percent.
亮度 ：亮度不是很难理解的，它用于设置颜色的亮度。 也确定在一个百分比之内。
Example:
例：
<!DOCTYPE html>
<html>
<head>
<style>
p {
background-color: hsl(50, 90%, 50%);
font-size: 50px;
color: hsl(0, 100%, 30%);
}
</style>
</head>
<body>
<p>My name is Anjali Singh.</p>
</body>
</html>
Output
输出量
Conclusion:
结论：
So, as you must have noticed that this property is pretty helpful when it comes to coding and it helps you reduce the line of codes. So, go ahead and start implementing this function right away and don't forget to have fun with the various shades of the colors. Never forget to learn more and more functions and whenever you fall in doubt then you know there are articles just like these to help you overcome every doubt. Also, if you still face issues, we are here to help you at https://ask.includehelp.com/.
因此，您一定已经注意到，此属性在编码时非常有用，并且可以帮助您减少代码行。 因此，继续并立即开始实现此功能，不要忘了尝试各种颜色的阴影。 永远不要忘记学习越来越多的功能，每当您有疑问时，您就会知道有些类似的文章可以帮助您克服所有疑问。 另外，如果您仍然遇到问题，我们会在https://ask.includehelp.com/上为您提供帮助。
翻译自: https://www.includehelp.com/code-snippets/hsl-function-with-example-in-css.aspx
css 中hsl颜色的意义
856
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
