Pular para o conteúdo principal

Destacar Áreas do Post


Como meu primeiro tutorial aqui no blog, vou mostrar como destacar algumas áreas de um post. Isso é relativamente fácil porque não exige muito conhecimento em CSS e é muito rápido pois precisa apenas de algumas modificações no código ele estará pronto para ser usado. Veja o exemplo:

Código sem destaque.
Código destacado.

Dependendo do seu conhecimento sobre CSS (ou da sua vontade de procurar no Google ;D), você pode modificar o CSS e criar coisas incríveis. O código de base é:
  1. .highlight {
  2. margin: 0px;
  3. padding: 5px;
  4. background-color: lightyellow;
  5. border: 1px solid yellow;
  6. }
Onde:
  • Margin é a distância em pixels do conteúdo com os outros elementos;
  • Padding se refere à distância em pixels do conteúdo com a borda;
  • Background-color é a cor do fundo;
  • Border modifica a borda da caixa (espessura, tipo e cor).
Sinta-se livre para modificar o código e depois, inseri-lo no código HTML do seu blog (Templates > Editar HTML) antes da tag
.
Enjoy it!

Postagens mais visitadas deste blog

Mudar Imagem ao Passar o Mouse

A interatividade é o que muitas vezes (quando combinada com bom conteúdo) faz com que os leitores gostem e voltem a visitar o seu site. Nesse tutorial você aprende um código em JavaScript que altera a imagem quando o cursor do mouse passa sobre ela.

Bordas arredondadas com CSS3

Uma das novidades trazidas pelo CSS3 é que as bordas dos elementos HTML podem ser arredondadas.

Cadastre-se no Technorati.

Eu começo agora uma série de tutoriais para você poder aproveitar mais algumas das mais conhecidas redes sociais, a começar pelo Technorati. Você poderá adicionar widgets em seus blogs, aprender mais sobre redes sociais e etc.