CUADRO DE TEXTO...

Lles enseñare como crear un "cuadro" en el cual pueden meter código, aunque igual puede funcionar con hasta con las etiquetas <>< / quote > ahora, veamos un ejemplo de lo que podrán obtener si modifican el código de acuerdo a sus necesidades.

Ahora, el código que se necesita es el siguiente:
Para agregar este código a Blogger, simplemente ve a Edición HTML y agrega el código antes de ]]>< / b:skin >
(SIN SEPARACIONES)

 
pre {
background:transparent url(http://img509.imageshack.us/img509/3046/codema7.png) no-repeat 0 0; /* Imagen Superior, si desas cambiarla modifica lo que se encuentra dentro de url(AQUI) */
padding-top:24px; /* Relleno - para ajustar Fondo */
}
pre code {
overflow:auto; /* Determina si es necesario agregar barras de Scroll */
background-color:#fffbe5; /* Color de Fondo en Hex */
border:1px solid #fff1a3; /* Color de Borde en Hex */
color:#7e1f09; /* Color de letra en Hex */
display:block; /* No tocar */
padding:5px; /* Relleno del cuadro */
white-space:pre; /* No tocar */
text-align:left; /* Alineacion del Texto , left=izquierda, center= centrado, right=derecha */su
min-height:63px; /* Altura minima del Cuadro */
}
/* Cuando pase el Mouse sobre la caja ocurrirá lo siguiente: */
code:hover {
background-color:#FEFEDD; /* Color de Fondo en Hex */
border:1px solid #ffd511;/* Color de Borde en Hex */le
}



Ahora, si desean modificar la apariencia, simplemente tienen que cambiar algunos Colores HEX, pueden encontrar una paleta aquí. Si quieren cambiar la Imagen que dice "Código" pueden hacerlo cambiando la dirección de la Imagen, se encuentra dentro de url( ) .



Solo necesitan poner el siguiente código para que funcione: <><> aquí el texto   < / code >< /pre>
(QUITAR LAS SEPARACIONES)

PARA MÁS INFORMACION:http://www.trucosblogger.com/2007/07/cuadro-de-codigo-para-tu-blog.html
SHARE

Milan Tomic

Hi. I’m Designer of Blog Magic. I’m CEO/Founder of ThemeXpose. I’m Creative Art Director, Web Designer, UI/UX Designer, Interaction Designer, Industrial Designer, Web Developer, Business Enthusiast, StartUp Enthusiast, Speaker, Writer and Photographer. Inspired to make things looks better.

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment
    Facebook Comment

1 comentarios: