Postado em: 6 de março de 2007 por Pedro Rogério
VocÊ perdeu algum post da série? Basta estar dando uma olhada aqui. Mas vamos ao que interessa, hoje iremos ver mais informações sobre a propriedade background, com ela você pode definir o fundo de um elemento com apenas uma linha:
background: #ffffff url(endereço_da_imagem) top left no-repeat fixed;
Valores
- attachment
- color
- image
- position
- repeat
Você também pode definir os valores individualmente.
Continuar lendo »
Postado em: 17 de outubro de 2006 por Pedro Rogério
Abaixo você pode ver as várias maneiras de se usar CSS para estilizar os links da sua página:
- a:link {color: #009900;}
- a:visited {color: #999999;}
- a:hover {color: #333333;}
- a:focus {color: #333333;}
- a:active {color: #009900;}
Agora vamos ver o que cada uma delas significa:
a:link {color: #009900;}
Usado para estilizar os links da página quando não está ocorrendo nenhum evento.
a:visited {color: #999999;}
Continuar lendo »
Postado em: 12 de setembro de 2006 por Pedro Rogério
Font
Com a propriedade font podemos alterar o estilo(style), o peso(weight), o variant(mostrar o texto em maiúsculas), o tamanho(size), o line-height(altura da linha), e a própria propriedade font.
font: italic bold normal small/1.4em Verdana, sans-serif;
o código acima pode ser lido da seguinte maneira: Da esquerda pra direita, o primeiro item deixaria nosso texto em itálico, com um peso bold, o variant normal, um tamanho relativo, depois a altura da linha setada em 1.4em e a font definida como Verdana, ou se não for encontrada no sistema, sans-serif.
Font-family
Aqui é onde definimos uma “família de fontes”. A 2 possíveis valores:
- Nome da Família
- Família Genérica
Se você adicionar um nome da família, é aconselhável também adicionar a família genéria em sua extremidade. Por que isso é priorizado na lista. Assim, se o usuário não tiver o nome o nome da font especificado em font-family, ele usará a mesma família genérica.
font-family: Verdana, sans-serif;
Continuar lendo »
Postado em: 24 de agosto de 2006 por Pedro Rogério
Cores
Você pode ajustar as cores do seu texto da seguinte forma:
cor: valor;
Os valores aceitos são:
- Nome da cor: Exemplo: (black, red…)
- Número Hexadecimal: Exemplo: (#ffffff, #000000)
- Código da cor RGB: Exemplo: ( rgb(255, 0, 0), rgb(0, 0, 0) )
Letter Spacing
Ou espaço entre as letras, pode ser ajustado da seguinte forma, deixando o valor em 0, impede que o texto justifique. Ele também aceita valores negativos.
letter-spacing: valor;
Valores aceitos:
Continuar lendo »
Postado em: 7 de agosto de 2006 por Pedro Rogério
Padding é a distância do elemento entre a borda e o seu conteúdo. As regras para margem também se aplicam ao padding, excepcionalmente o valor “auto” e valores negativos, que não podem ser declarados:
padding-top: valor;
padding-right: valor;
padding-bottom: valor;
padding-left: valor;
Você também pode declarar esses valores para padding em uma única propriedade:
padding: 10px 10px 10px 10px;
Continuar lendo »
Postado em: 1 de agosto de 2006 por Pedro Rogério
A propriedade margem declara a margem entre um elemento do HTML e os elementos em torno dela. A propriedade margem pode ser ajustada para o alto, direita, abaixo e a esquerda:
margin-top: valor definido pelo usuário ou auto;
margin-right: valor definido pelo usuário ou auto;
margin-bottom: valor definido pelo usuário ou auto;
margin-left: valor definido pelo usuário ou auto;
Você tem a escolha de 3 valores para a propriedade margem, que são as seguintes:
- Comprimento: em pixels
- Porcentagem
- Auto
Continuar lendo »
Postado em: 25 de julho de 2006 por Pedro Rogério
Spans são similares as divisões, a não ser que sejam um elemento in-line ou um elemento de bloco. Nenhuma quebra de linha é criada quando um span é declarado. Você pode por exemplo usar span para estilizar áreas específicas do seu texto, como você pode ver no exemplo abaixo:
<span class="italico">Esse texto irá ficar em itálico</span>
O CSS fica da seguinte forma:
.italico { font-style:italic; }
Tradução do artigo original de: CSS Basics.