.
  Codigos css
 

Hola! hoy dejaremos de usar HTML, y vamos al nivel "MASTER" que es de diseño web, muchas personas desean hacer su propia plantilla en ice-blue pero no pueden por no saver como :S.Para modificarla usaremos codigos CSS y aquçi os esplicare de la forma mas sencillo que conosco para modificar su plantilla.

Bueno en este tutorial enseñare de una forma mas sencilla a las anteriores de como hacer su plantilla persolizada.

Este codigo que os presentare...se coloca al pie de la pagina de la plantilla ice-blue.(solo esta)

Por favor prestad atencion al siguiente codigo que dare, que ya lo hize modifike para que se entienda mas.

Código:
<style type="text/css">

<!--
td.edit_header_full{background-image:url(URL de la imagen del encabezado);}
body{background-image: none;background-color:#Numero del color de fondo;}
td.nav{background-image:url(URL del boton del menu sin pasar mouse);}
td.nav:hover{background-image: url(URL del boton del menu al pasar mouse;}
td.nav_heading{background-image:url(URL de la imagen del boton del titulo de navegacion);}
td.edit_below_nav{visibility:hidden;}
td.edit_navi_headbg{background-image: none;}
td.edit_rechts_sbg{visibility:hidden;}
td.sidebar_heading{background-image:url(URL de la imagen que sera de fondo del titulo del box);}
td.edit_content_top{background-image:url(URL del titulo del contenido);}
td.edit_content{background-image:url(URL de la imagen del centro del contenido);}
td.edit_content_bottom{background-image:url(URL de la imagen del semi-final del contenido);}
td.edit_content_bottom2{background-image:url(URL de la imagen del final del contenido);}
td.shouty{background-image:url(URL de la imagen del contenido de la box);}
td.shouty2{background-image:url(URL de la imagen del contenido de la box);}
td.shouty3{background-image:url(URL de la imagen del contenido de la box);}
td.shouty4{background-image:url(URL de la imagen del contenido de la box;}
td.shouty5{background-image:url(URL de la imagen del contenido de la box);}
td.edit_rechts_cbg{background-image: url(URL);}
td.edit_rb_footer{background-image:url(URL de la imagen del pie del box);}
td.edit_rechts_bottom{background-image: url(URL);}
td.edit_content_bottom:hover{background-image: none;}

--></style>


Por favor prestad atencion a la linea Nº4, hay recien comienza a poder modificar la plantilla. Explicacion de las lineas:

La linea Nº4 es la del encabezado.
La linea Nº5 es la del fondo de la pagina, (que en este caso yo puse un color en vez de imagen, pero si quieren imagen solo coloquen la url dentro de los parametros "(" y ")" )
La linea Nº6 es la imagen que ira en el menú sin que el mouse este enzima(o sea te aplica un efecto al pasar sobre el raton, pero ahora viene la explicacion de como hacerlo)
La linea Nº7 es la imagen que ira en el menú al pasar el mouse(o sea, editai la imagen de la linea Nº6 y le colocai algo asi como un flecha al lado.) y esto ase que se haga un efecto muy bueno.
La linea Nº8 es la imagen que sera para la iamgen que ira en el titulo de navegacion del menú.(si es que me entienden)
La linea Nº12 es la imagen que sera para el titulo de las box.(las Nª9, 10 y 11 aun no descubro para k son)
La linea Nº13 es la imagen que sera para el titulo de sus paginas( osea la parte de arriva del contenido de la web.)
La linea Nº14 esta sera la iamgen que sera algo asi como el "body" o cuerpo en español, y sera la iamgen donde va a estar el contenido de la pagina web(o sea la informacion de la pagina)
La linea Nº15 sera la imagen que estara apunto de llegar al final del contenido de la pagina(en mi web cuando estay a punto de llegar al final del contenido, sale "Plantilla editada por nosotros" y que desaparece al pasar el mouse.)
La linea Nº16 sera la imagen que ira al fondo del contenido de la pagina(donde normlamente se coloca el contador de visitas en la plantilla red o ice-blue.)
La linea Nº17 a la linea Nº24 seran las imagenes para el contenido de las box's.
La linea Nº26 sera la imagen que se usara apra el final del contenido de la box(en mi web es como una hoja cortada)(la linea Nº25, la Nº 27 y 28 no se para que sirven aun, pero voy a intentar averiguarlo.)

Tamaño de las imagenes(todos estan representados en pixeles):

-Encabezado:.................................................................................921x104
-Fondo: ........................................................................................... ?
-Botones del menu(o sea la linea Nº6 y 7):.............................185x33
-Navegador del menú:.................................................................185x24
-Titulo box:......................................................................................168x24
-Titulo pagina:................................................................................568x38
-Contenido pagina:.......................................................................568x300
-Semi-final pagina:....................................................................... 568x31
-Final pagina:..................................................................................568x34
-contenido box:............................................................................. 168x800
-Pie del box: ...................................................................................168x27

Espero haberles ayudado... 

Tutorial de css echo por http://www.fansdeathnote.es.tl/

 
 
  Hoy habia 5 visitantes (19 clics a subpáginas) ¡Aqui en esta página!  
 
Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis