Como usar cor hsl para o seu html5 e css3 páginas web baseadas

Você pode atribuir um valor HSL onde quer que você use cores na sua página web HTML5 e CSS3. O código para HSLcolors mostra como o esquema de HSL pode ser usado em sua página:

Video: CSS and CSS3 Colors Hex, RGB , RGBA, HSL, HSLA and Opacity

HSLcolors.html

Este é um título

Este é um parágrafo

Video: CSS: colores en CSS3

Para especificar uma cor usando o esquema de HSL, faça o seguinte:

Configure suas seletores como de costume.

No CSS, criar um seletor para cada elemento que você deseja colorir.

  • Adicione a regra de cor.

    Aplicar um ou ambos para cada selector.



  • Use a função HSL.

    Usando HSL seguido por parênteses indica que você deseja calcular a cor usando a técnica HSL.

  • Indicar o matiz.

    Imagine uma roda de cores com vermelho na parte superior. A tonalidade é o ângulo (em graus) da cor que você quer escolher. Hue deve ter um valor entre 0 e 360.

  • Determinar a saturação.

    Saturação é medida como uma percentagem. Saturação de 0% indica uma escala de cinzentos (algures entre o preto e branco), enquanto que a saturação de 100% é uma cor completamente saturado sem escala de cinzentos. Você precisa incluir o sinal de porcentagem como parte do valor de saturação.

  • Especifique a leveza.

    Leveza também é indicada em percentagem, com 0% sendo completamente preto e 100%, sendo completamente branco. Um valor de luminosidade de 50% irá determinar uma cor equilibrada entre o branco eo preto. valores de luminosidade também deve incluir o sinal de porcentagem.

  • O modelo HSL é uma adição relativamente recente à CSS, por isso não pode trabalhar com navegadores mais antigos, mas pode ser extremamente útil. HSL torna mais fácil de prever se as cores vai ficar bem juntos. Se você manter qualquer dois do HSL valoriza o mesmo e mudar o terceiro, as duas cores são susceptíveis de se encaixam bem.


    Publicações relacionadas