Básico do CSS para tumblr




 Para construir o estilo da página, ou seja, as cores, as posições e tudo mais, é necessário entender os comandos em CSS. Aqui vão os básicos, que podem ser usado em quase todas as formatações que você fizer em seu theme.

 background-color:#COR EM HTML;
Para que serve? Para determinar a cor do fundo. Para que geralmente é utilizada? Fundo do theme, caixa dos posts/sidebar, caixa do menu, etc. O que são cores em HTML? Para a cor “funcionar” e aparecer no theme, ela precisa estar em HTML. Você encontra os códigos em geradores, por exemplo, eu uso esse aqui.
background-image:url('URL DA IMAGEM');
Para que serve? Para determinar o fundo colocando uma imagem. Para que geralmente é utilizada? Fundo do theme, caixa do menu hover, etc. O que é a URL da imagem? Quando você clica com o botão direito do mouse em uma imagem, clique em “copiar URL da imagem”, e pronto, esse é o endereço HTML dela. Eu tenho uma foto no meu computador, como consigo o código HTML dela? Você hospeda ela em algum site. Eu uso esse aqui.
font-family:'NOME DA FONTE';
Para que serve? Para determinar a fonte da escrita de determinado local. Para que geralmente é utilizada? Para determinar o nome da fonte em qualquer lugar do HTML.Qualquer nome de fonte que eu colocar ali, aparece? Não. As mais simples, que já vem no computador, é só colocar o nome que aparecem. Mas algumas você precisa fazer download e etc para aparecer. 
font-size:NUMEROpx;
Para que serve? Para determinar o tamanho da fonte de determinado local. Para que geralmente é utilizada? Para determinar o tamanho da fonte em qualquer lugar do HTML.Qualquer número que eu colocar ali fica certo? Sim. O que é ‘px’? Uma unidade de medida HTML, existem outras como ‘pt’ e etc.
letter-spacing:NUMEROpx;
Para que serve? Para determinar o espaçamento entre as letras de determinado local.Para que geralmente é utilizada? Para determinar o espaçamento das letras emqualquer lugar do HTML. Qualquer número que eu colocar ali fica certo? Sim. Qual número eu coloco pra não deixar nenhum espaçamento entre as letras, deixá-las ‘normais’? 1px.
line-height:NUMEROpx;
Para que serve? Para determinar o espaçamento entre as linhas. Para que geralmente é utilizada? Em títulos dos posts, ou i-frame. Qualquer número que eu colocar ali fica certo? Sim. Qual número eu coloco para as linhas não ficarem grudadas e impossíveis de ler? 30px.
font-style:normal; font-style:italic; font-style:bold;
Para que servem? Para determinar o estilo da fonte. Cada uma das três tem funções diferentes. ‘Normal’ é para a fonte ficar sem efeito algum, ‘italic’ para ficar em itálico e ‘bold’ para ficar em negrito
width:NUMEROpx;
Para que serve? Para determinar a largura de determinada coisa. Para que geralmente é utilizada? Para determinar a largura da sidebar, da caixa dos posts, da caixa do menu e etc.
width="NUMEROpx"
Para que serve? Para determinar a largura de determinada imagem
height:NUMEROpx;
Para que serve? Para determinar a altura de determinada coisa. Para que geralmente é utilizada? Para determinar a altura da caixa do menu.
height="NUMEROpx"
Para que serve? Para determinar a altura de determinada imagem
t:left; text-align:right; text-align:center;ext-align:justify; text-align
Para que servem? Para determinar o alinhamento do texto de determinado local. Cada uma das quatro tem função diferente. ‘Justify’ é para deixar o texto justificado, ‘left’ para alinhar a esquerda, ‘right’ a direita e ‘center’ ao centro.

Nenhum comentário:

Postar um comentário