Linda Martins, 18, Salvador. Livros (os que leio e os que escrevo), cristianismo, estudos aleatórios e comida definem minha vida. Em constante evolução.

ENTREVISTA
Rudson Xaulin

RESENHA
Um beijo inesquecível

AUTORAIS
Baed

26.12.14

Aprendendo html #03 - O CSS

Olááá!
No último post, expliquei algumas tags que iam no head, o "cabeçalho" do template. Fechando essa tag com </head> (já que terminamos essa etapa), entraremos no que, para mim, é a parte mais interessante e longa nisso tudo: O CSS.

O Cascading Style Sheets ou simplesmente, CSS, é a folha de estilos do seu template. Aqui você vai definir como tudo irá aparecer no seu blog, posições, cores, tamanhos, fontes, alinhamento... A tag de início do CSS é o <style> e o fechamento, assim como todas as outras, com aquela barra </style>. As informações contidas nele possuem uma ordem: seletor {propriedade: valor;}. Não entendeu? Eu explico...

  1. O SELETOR "BODY" 
Primeiramente, um aviso: JAMAIS CONFUNDA "BODY" COM "<BODY>"! O body é um seletor do CSS, o primeiro que vai aparecer no template. Existem vários seletores diferentes, cada um deles responsável por definir o que aparece e como aparece cada parte do seu theme. É no body que você vai definir as informações iniciais do design do seu blog, como o plano de fundo, por exemplo.Já o <body> é uma outra tag que vem logo depois do style, que vamos ver mais a frente.
Uma das propriedades mais básicas do css é o "background" que é nada mais do que o plano de fundo do seu blog. Ele pode ser liso, com apenas uma cor, ou pode ter alguma imagem, quem define é você.
body {background:... 

Digamos que você queira um background liso e branco. Para isso, você usa a     propriedade "background-color" e expressa a cor que você quer. A cor é posta em números, dessa forma: #XXXXXX; é praticamente impossível decorar todos os     valores, por isso tabelas e programas para isso estão disponíveis na internet, porém, os valores para preto e branco - que são os mais usados - são: #fff para branco e #000 para preto. Portanto, um plano de fundo branco vai ficar assim no CSS:

body {background-color: #fff;}

Caso você queira uma imagem no seu plano de fundo, o código muda um pouco; voltamos àquela forma original sem o "-color" na propriedade. Você vai copiar a URL da imagem que você quer no seu background e colar no código desse jeito:

body {background: url ('AQUI VAI SUA URL');} 

Por fim, há uma outra propriedade que vai definir se sua imagem vai se repetir ou não no template: o "background-repeat". O valor é simples: "repeat" para que a imagem se repita e "no-repeat" para que ela não se repita.

body {background: url (''); background-repeat: no-repeat;}