Aula de CSS para Iniciantes
Para ter um Blog de qualidade, é preciso ter uma noção de HTML. Se desejar editar o template de um Blog, é preciso saber CSS, um código fundamental na criação de templates. Após as aulas de HTML que criei, vim disponibilizar uma aula básica de CSS, onde ensinarei o que é preciso para editar o seu template.
CSS é o código encontrado em todos os templates, que permite editar o estilo, cor, e outras alterações no seu layout. Não é possível criar scripts com CSS, ele permite apenas alterar o estilo de um template, para isso, precisaria de um código HTML. Para visualizar as aulas de HTML que publiquei, acesse o marcador HTML. Para iniciar a nossa aula, vamos entender como uma tag CSS é aberta. Toda tag CSS é iniciada com "#", seguida do nome da parte que ela será alterada. Vamos supor, que alteraremos o texto do título do Blog. Para isso, usaremos o texto header h1, que é encontrado em todos os templates. Após escrever o nome, deverá abrir chaves, para instalar os comandos que o CSS executará.
#header h1 {
A tag foi aberta. Agora, como estamos alterando a cor do texto do título de seu Blog, vamos usar o comando "color", seguida de :, definindo a cor da letra.
#header h1 {
color: black
Já definimos a cor do texto do título. Está na hora de definir a fonte do texto. Para isso, adicionaremos "font-family" e o nome da fonte desejada.
CSS é o código encontrado em todos os templates, que permite editar o estilo, cor, e outras alterações no seu layout. Não é possível criar scripts com CSS, ele permite apenas alterar o estilo de um template, para isso, precisaria de um código HTML. Para visualizar as aulas de HTML que publiquei, acesse o marcador HTML. Para iniciar a nossa aula, vamos entender como uma tag CSS é aberta. Toda tag CSS é iniciada com "#", seguida do nome da parte que ela será alterada. Vamos supor, que alteraremos o texto do título do Blog. Para isso, usaremos o texto header h1, que é encontrado em todos os templates. Após escrever o nome, deverá abrir chaves, para instalar os comandos que o CSS executará.
#header h1 {
A tag foi aberta. Agora, como estamos alterando a cor do texto do título de seu Blog, vamos usar o comando "color", seguida de :, definindo a cor da letra.
#header h1 {
color: black
Já definimos a cor do texto do título. Está na hora de definir a fonte do texto. Para isso, adicionaremos "font-family" e o nome da fonte desejada.
#header h1 {
color: black
font-family: arial
Agora, continuando a configuração do texto do título, vamos adicionar o comando que definirá o tamanho do texto, ou seja, o "font-size".
#header h1 {
color: black
font-family: arial
font-size: 12
Como no código HTML, o texto para definir a posição de algo, é o "text-align", o mesmo usado no CSS.
#header h1 {
color: black
font-family: arial
font-size: 12
text-align: center
Logo após que o título do Blog já foi configurado, vamos fechar a tag com chaves.
#header h1 {
color: black
font-family: arial
font-size: 12
text-align: center
}
Estas tags CSS não precisam ser criadas em um templates, pois todos os templates contém elas. Ensinei como funciona o CSS apenas para vocês terem uma noção. Existem muitos outros comandos, como "font-weight". O CSS é mais fácil que o HTML, e também é de fácil edição. Não há segredos no CSS, basta editar, remover ou incluir comandos, que o estilo de seu Blog irá atender a todas as mudanças no código fonte. O CSS pode mudar totalmente o layout de um Blog, basta saber usá-lo de forma correta.


7 Comentários:
Ótima aula, parabéns pelo blog!
Faltou explicar como funcionam os seletores do CSS, mais já é um bom inicio para quem está começando.
Aula muito capenga, faltou tudo.
BaixaMuito,
Esta foi uma aula apenas para se ter uma noção de como funciona o CSS. Pretendemos publicar tutoriais de melhor qualidade sobre o assunto mais tarde.
Ta ótima a aula!
como voçê coloca este link?
Voçê pode gosta também de:
Quesia,
Utilizo o seguinte widget: http://www.desenvolvimentoblogger.com.br/2010/01/linkwithin-gadget-de-artigos.html
Postar um comentário
-> NÃO faça comentários ofensivos;
-> Faça comentários apenas RELATIVOS ao assunto do artigo;
-> NÃO faça conversas nos comentários;
-> É PROIBIDO usar links desnecessários, para isso comente usando OpenID;
-> Os comentários são VERIFICADOS, para garantir que não seja violada as regras acima;
Se preferir, fale conosco pela página de CONTATO.
Dica
Use tags como <b> e <i> para fazer comentários mais relevantes.