Códigos básicos em HTML que você PRECISA saber

Quem tem um blog ou um site, muitas vezes não precisa saber de programação, pois é bem melhor contratar um programador que faça aquilo que a gente precisa, então ficamos somente com a parte de “post > adicionar novo”. Só que, mesmo para a criação de alguns posts ou até mesmo ajustar coisas simples, é legal que a gente saiba alguns códigos para sermos mais independente e poder resolver algumas coisas na hora, não é mesmo? Por isso, fiz uma lista com alguns códigos básicos em html que todo mundo deveria saber – até mesmo, quem não possui blog, é sempre bom o conhecimento, né?

Mesmo eu não sendo programadora, em minha família muitas pessoas são, portanto, é inevitável não conversar sobre, ou dar uma sapiada no que estão comentando, afinal a curiosidade é tudo nesse mundo hehe. Vamos lá:

Alterar a cor da fonte

Uma coisa bem simples – mas que muda totalmente o post – são as cores; e alguns temas (digo no WordPress), não possui a alteração da cor automática na interface, aí é preciso mudar manualmente.

<span style="color: #FFFF;">Seu texto aqui</span>

O código da cor, você pode pegar no Photoshop, no Canva, no “inspecionar” na internet, ou até mesmo na internet. O site HTML Color Code tem diversas paletas, onde você clica na cor escolhida e ele dá o código certinho, aí é só substituir na tag.

Pular linha

Uma das tags mais básicas (e importantes) é essa de pular linha, definida simplesmente pela

<br>

Pode ser usada para pular linha entre textos ou imagens.

Centralizar mídias incorporadas do Instagram ou Youtube

Para centralizar uma mídia do Instagram ou Youtube, as vezes precisamos utilizar a tag div, pois em alguns casos os botões de alinhamento não alinham esse tipo de mídia.

<div align="center"></div>

É possível alterar o “center” para “left”, quando quiser alinhado à esquerda; “right”, quando quiser alinhado à direita; “justify” quando quiser justificado. Essa tag funciona tanto para mídias como eu falei, como para imagens e textos também.

Adicionar imagem

A tag para adicionar imagem pode ter bastante utilidade também para quem for enviar e-mail marketing, e precisa colocar a tag manualmente para adicionar a imagem desejada.

<img src="nomedafoto.jpg">

Lembrando que o arquivo da foto pode ou estar hospedado em algum lugar, sendo assim o que muda é somente o nome da foto de “nome da foto” para “http://nomedafoto.jpg” (ou quaisquer que seja a extensão da imagem rs)

Caso seja necessário, você pode aumentar ou diminuir o tamanho da imagem, utilizando height=”” width=”” dentro da tag img. Sendo assim, ficaria dessa forma:

<img src="nomedafoto.jpg" height="42" width="42">

Adicionar estilo marca texto

Para dar um destaque maior em algumas palavras, a opção de marca texto pode ser bem interessante. É bem simples, e assim como a tag para escolher as cores, nesse caso você também deverá colocar o código da cor escolhida.

<span style="background-color: #FFFF;">Seu texto aqui</span>


Existem muitos outros códigos, mas acredito que esses sejam os mais básicos e que podem nos ajudar mais no dia a dia. Se você conhece algum e queira compartilhar, por favor escreva nos comentários.

Se você chegou até aqui, não esqueça de compartilhar esse post e ajudar o blog a crescer 😀

Bjs,
Dani.

Deixe uma resposta