12 abril 2013

Estilo de "< pre >"



O "pre" é muito utilizado por tumblrs de html, já que com ele podemos escrever códigos html, e quem utilizar, não precisará recolocar todas as aspas(coisa que você teria que fazer, se postasse seu código sem estar entre o <pre></pre>.

Enfim, achei na internet um código fácil, e bem legal de personalizar:
 /****** pre por mundogallyack.com****/
pre{
background: #fff ;
padding: 1px;
letter-spacing: 2px;
font-family: courier;
font-size:11px;
margin: 2px 3px 4px 5px;
overflow: auto;}

Entendendo o código:
- background: a cor de fundo, lembrando que pode ser uma imagem, basta retirar o código da cor, e acrescentar o "url(linkdaimagem)" - sem aspas;
- padding: a distância do texto a margin da caixa;
- letter-spacing: só deixe se quiser, este comando faz com que as letras se distanciem uma das outras;
- a fonte, tamanho...
- margin: como ele irá se posicionar dentro da caixa de seu post, (...) no exemplo ele ficaria: 2px do topo,3px da direita,4px do rodape, 5px da direita.
- overflow: então, esse é o principal... pode ser usado o "auto" ou o "scroll". o auto criará apenas em baixo um barra de rolagem, e criará apenas de for necessário... já o scroll criará a barra embaixo e na direita, mesmo que não seje necessário, a barra irá aparecer caso coloque scroll.
Bom, depois de ter lido alguns posts na internet, cheguei a essa conclusão para o <pre>.

0 comentários :

Postar um comentário