Barra verde

Como colocar "elementos gráficos" num blog?
Para quem sabe html é fácil fazê-lo.
Para quem não sabe, iremos polvilhando este blog com algumas dicas.
Não o queremos fazer de atacado, para não tornar a tarefa muito árdua.
Passo a passo talvez seja mais sensato.

Repararam na barra verde que delimita os posts deste blog de dicas?

---

Esta barra é gerada pelo seguinte código html (sinais + são para retirar, colocados apenas para permitir que esta linha de código seja visualizada)
<+hr size=+"4" color=+"#008000" width=+"30%" align+=+"left">

hr size é a grossura da linha. Se em vez de "4" colocarem "2", a grossura da linha diminui para metade.
<+hr size=+"2" color=+"#008000" width=+"30%" align+=+"left">

---

Color é a cor atribuída à linha. "#008000" dá o verde-escuro
#800000" gera castanho-escuro

---

"#000080" dá-nos azul escuro

---

"#FF00FF" gera uma barra cor-de-rosa

---

width="30%" indica o comprimento da linha.
Diminuindo este valor, a barra fica mais pequena (diminuímos para 10%):

---

aumentando fica mais comprida (aumentámos para 60%):

---

Por último, a "ordem" para o alinhamento da barra (align="left">).
Neste caso "sugerimos" educadamente a Mister HTML que alinhasse a nossa barra à esquerda.
Se a quisessemos ao centro seria (align="center">);

---

e alinhada à direita seria (align="right">).

---

---