5 de nov de 2009

Taquigráfia CSS

O uso da notação taquigráfica pelo CSS ajuda na escrita de um CSS (Cascading Style Sheets) mais limpo, o que facilita a manutenção, e para o uso na Web melhora o carregamento da página.
Em um resumo o CSS Taquigráfico transforma varias chamadas da mesma propriedade em uma única, nada melhor para explicar que exemplos de uso, então vamos a eles.

RGB (cores)
O uso da propriedade de cor RGB, se da por #rrggbb
A chamada:
color: #AABBCC;
Com o uso taquigráfico:
color: #ABC;

Nesse exemplo usamos os índices repetidos por apenas 1 o AA virou A o BB -> B o CC -> C

Background - background: background-color background-image background-repeat background-attachment background-position
ex: background: #ABC url(imagem.png) no-repeat fixed center center;

Margin - margin: Top Right Bottom Left;
ex: margin: 1px 2px 3px 4px;
obs: A propriedade Margin é similar a Padding

List - list-style: list-style-type list-style-position list-style-image
ex: list-style: katakana outside url(imagem.png);

Font - font: font-style font-variant font-weight font-size font-family
ex: font: italic small-caps bold 50px serif;

Outline - outline: outline-width outline-style outline-color
ex: outline: 3px dotted #ABC;
obs: A propriedade Border funciona da mesma maneira

Lembrando algo mais posto aqui, vale ressaltar que você pode omitir alguma(s) propriedade(s) como por exemplo:
background: url(imagem.gif) no-repeat;