HSLA Función () con el Ejemplo en CSS

CSS | HSLA () la función : Aquí, vamos a aprender acerca de la función HSLA () con su sintaxis, ejemplos de CSS (Cascading Style Sheet).

Introducción:

El uso de las funciones es el desarrollo class web muy beneficiosa y uno debe aprender mayor cantidad de funciones que pueden, por lo tanto, seguir aprendiendo funciones for mejorar sus conocimientos y habilidades de codificación. Además, usted no sólo debe aprender acerca de ellos, pero en cambio, se deben implementar en sus códigos, de esta manera obtendrá familiarizados con el comportamiento de esa función en particular y que será habitual utilizar más funciones en un futuro próximo. Como usted ya sabe, cuanto más se codifican más sus habilidades se consiguen mejor y más las posibilidades de convertirse en programadores profesionales. En el mundo actual, es muy difícil encontrar buenos programadores. Así codificar y convertirse en un codificador éxito.

Ahora, que estamos hablando de funciones tanto, ¿por qué no hablamos acerca de una función muy popular conocida como la función () y comprender su comportamiento y los valores HSLA? Tenga la seguridad, mientras que el uso de esta función de su línea de código se reducirá y que querría usar esta función una y otra vez. Así que para obtener una mejor comprensión de esta función para vamos a echar un vistazo a su definición y su sintaxis.

Definición:

La función HSLA () podría denominarse como una extensión de la función de HSL (), la función de HSL () como es posible que ya sabe que HSL se encuentra for Tono Saturación y Luz componente mientras HSLA se encuentra for Tono Saturación Luminosidad y Alpha. El alfa es el factor adicional en la función HSLA. Al igual que en HSL () función, la función HSLA () también se utiliza para especificar diferentes valores de colores. Ahora, vamos a echar un vistazo a la sintaxis de esta función:

Sintaxis:

    element{
color: hsla(hue,saturation,lightness,alpha)
}

Valores:

Vamos a entender cada uno de estos valores, uno por uno,

  • HUE : Hue es un contenedor que le permite ajustar el color de una rueda de color.
  • SATURACIÓN : Saturación, como su nombre indica, especifica la saturación del color. Su valor varía entre 0% demasiado 100% .
  • LEVEDAD : La ligereza no es tan difícil de entender, que se utiliza para establecer la luminosidad del color. Su valor varía entre 0% demasiado 100% .
  • ALPHA : valor alfa se usa para ajustar la opacidad de un color particular. Su valor varía entre 0 (completamente transparente) a 1 (totalmente opaco).
  • Ejemplo:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    p {
    background-color: hsla(50, 90%, 50%, 0.5);
    font-size: 50px;
    color: hsla(0, 100%, 30%, 0.7);
    }
    </style>
    </head>
    <body>
    <p>My name is Anjali Singh.</p>
    </body>
    </html>

    salida

    hsla() Function with Example in CSS - 4

    En el ejemplo anterior, la opacidad del color de fondo se establece en 0,5 y la fuente se establece en 0,7 .

    Conclusión:

    Ahora, que usted ha aprendido acerca de las maravillas de esta función, entonces ¿qué estás esperando for? Usted tiene la sintaxis y el Ejemplo seguir adelante y empezar a aplicar de inmediato y no se olvide de jugar con varios colores y todos sus matices. En class se cae de alguna duda, acaba de regresar e ir a través del artículo una vez más.


    Deja un comentario

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *