Códigos básicos html #4 - Tutorial
Boa tarde!! Vamos continuar a nossa maratona de códigos e tags!
Se você é visitante, não esqueça de conferir os outros 3 posts anterior a este
tem na barra DIY & Tutoriais todos lá 😉
No último post fiquei devendo a tag de alterar o tamanho da fonte,
então vamos começar por ela e já aproveito e ensino a colocar plano de fundo no nosso html.
Bora começar!
O último código citado foi este:
<HTML>
<!DOCTYPE HMTL PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HEAD>
<TITLE> Hino de Minas Gerais</TITLE>
</HEAD>
<BODY>
<H1><CENTER>Hino Nacional Brasileiro</CENTER></H1>
<BR>O seu céu é do puro anil
<BR><B>De um povo <FONT COLOR = "#FF00C8">heroico</FONT> o brado retumbante</B>
<P>E o sol da liberdade, em raios fúlgidos
</BODY>
</HTML>
Nele tem a segunda frase do nosso texto toda em negrito e a palavra heroico de rosa. Vou organizá-lo tirando o negrito e deixando tudo de preto mesmo, que é a cor padrão da fonte, então o código que vou usar será este:
<HTML>
<!DOCTYPE HMTL PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HEAD>
<TITLE> Hino de Minas Gerais</TITLE>
</HEAD>
<BODY>
<H1><CENTER>Hino Nacional Brasileiro</CENTER></H1>
<BR>O seu céu é do puro anil
<BR>De um povo heroico o brado retumbante
<P>E o sol da liberdade, em raios fúlgidos
</BODY>
</HTML>
A tag que usamos para alterar o tamanho da fonte do texto do nosso html é a FONT SIZE, funciona da mesma forma que a FONT COLOR, onde terminamos a tag (/>) somente com FONT. Vamos montar pra entender, vou colocar a primeira frase tamanho 1, a segunda 2 e a terceira 3, para isso o html ficará assim:
<HTML>
<!DOCTYPE HMTL PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HEAD>
<TITLE> Hino de Minas Gerais</TITLE>
</HEAD>
<BODY>
<H1><CENTER>Hino Nacional Brasileiro</CENTER></H1>
<FONT SIZE = "1">O seu céu é do puro anil</FONT></BR>
<FONT SIZE = "2">De um povo heroico o brado retumbante</FONT><BR>
<FONT SIZE = "3">E o sol da liberdade, em raios fúlgido</FONT><BR>
</BODY>
</HTML>
E a visualização no navegador ficará assim:
Com toda sinceridade não acho tão necessária a tag já que eu posso alterar usando a H, que expliquei no primeiro post de html, que quanto maior o número, menor a fonte, indo de 1 a 6. Porém acho muito válido aprender porque pode aparecer num template por exemplo e você saberá alterar, nunca se sabe...
Agora plano de fundo! A tag usada é a BGCOLOR. Bom como se usa? Ela é semelhante as cores da fonte que também ensinei no post passado, escolhemos a cor do fundo com os códigos Web das cores, tem um site com uma lista das cores e seus códigos é só CLICAR AQUI para ser redirecionado ao site. Também ensinei a "pegar" esse código no PhotoFiltre, se não viu entra lá e dê uma lida 😁
Muito bem, vou usar o mesmo código html com tamanhos de fonte diferentes e colocar o plano de fundo rosa (#FF00C8), a mesma cor do post passado kk. Colocando, ficará assim:
<HTML>
<!DOCTYPE HMTL PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HEAD>
<TITLE> Hino de Minas Gerais</TITLE>
</HEAD>
<BODY BGCOLOR = "#FF00C8">
<H1><CENTER>Hino Nacional Brasileiro</CENTER></H1>
<FONT SIZE = "1">O seu céu é do puro anil</FONT></BR>
<FONT SIZE = "2">De um povo heroico o brado retumbante</FONT><BR>
<FONT SIZE = "3">E o sol da liberdade, em raios fúlgido</FONT><BR>
</BODY>
</HTML>
Antes de ver no navegador, quero que observe bem que a tag BGCOLOR entra na frente da tag BORY, na 6ª linha do nosso código, caso contrário não funciona. As cores pode ser as "pré-definidas" também, aquelas da tabela do último post, por exemplo red, navy, green... Depois que colocar a cor, no Browser aparecerá assim:
Então é isso!
Pense positivo! Cumpri minha promessa! Trouxe as tags e dou certeza que vai ter mais.
Não esqueça de comentar se encontrar erros e dúvidas,
E não se esqueça também que no último post de html básico
disponibilizarei uma pasta com TODOS os códigos aqui usados e mais alguns úteis.
Espero vocês no próximo post!
Até lá. Beijão 😘
*Para compartilhar essas imagens e informações no seu site ou blog não esqueça de colocar os créditos ao blog!
Compartilhe o post e ajude o blog a crescer!
Comente!
Seu comentário é muito importante para o crescimento do blog e geração de melhores conteúdos!
Comentários com insultos serão removidos!
Lembre-se: Críticas são diferentes de ofensas!