image

Accede a bootcamps ilimitados y a más de 650 cursos

50
%OFF
Article image
Sergio Sousa
Sergio Sousa20/10/2024 23:55
Compartir

Shorthands em CSS

    Shorthands em CSS são declarações abreviadas que permitem definir várias propriedades relacionadas em uma única linha. Elas tornam o código mais conciso e fácil de ler.

    Exemplos comuns incluem margin, padding, background, e font. Usando shorthands, é possível definir valores para diferentes lados ou aspectos de um elemento sem a necessidade de múltiplas declarações. Isso economiza tempo e facilita a manutenção do código.

    Font:

    .container{
    font-weight: bold;
    font-style: italic;
    font-variant: small-caps;
    font-size: 1em;
    line-heightL 1.6;
    font-family: Arial, Helvetica, sans-serif;
    }
    

    Exemplo shorthand

    .container{
    font: bold italic small-caps 1em/1.6 Arial, sans-serif;
    }
    

    Background:

    .container{
    background-color: #ddd;
    background-image: url(image.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-attachment: fixed;
    }
    

    Exemplo shorthand

    .container{
    background #ddd url(image.png) no-repeat top lefy fixed;
    }
    

    Por curiosidade traduzi por parte SHORT que significa CURTO e HANDS que significa MÃOS. mais no inglês agente pode traduzir a palavra "shorthands" no português como "abreviações" ou "formas abreviadas". No contexto do CSS, refere-se ao uso de uma única declaração para definir várias propriedades relacionadas de maneira abreviada.

    Valeu? Espero ter ajudado a tornar você mais curioso.

    Linkendin

    https://www.linkedin.com/in/sergiosousa-tec/

    GitHub

    https://github.com/SergioDevSousa

    Compartir
    Comentarios (0)