Mundo MyA


 
PortalÍndiceGaleríaFAQRegistrarseConectarse
Mundo MyA MuSIC

Calendario

Comparte | 
 

 Como Hacer tu Planilla con CSS

Ver el tema anterior Ver el tema siguiente Ir abajo 
AutorMensaje
M-A
Administrador
Administrador
avatar

Masculino
Cantidad de envíos : 191
Edad : 22
Mi País es... :
Fecha de inscripción : 20/06/2008

Anime Poins
Anime Points:
100/100  (100/100)

MensajeTema: Como Hacer tu Planilla con CSS   12/07/08, 11:40 am

Paso 1, el fondo:

body{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_navi_headbg{background-image:url();}
td.edit_rechts_cbg{background-image:url();}
td.edit_rechts_bottom{background-image:url();}

Aqui hay dos opciones para el fondo de tu pagina:
Si tienes una imagen deves borrar solo esta parte "background-color:#NÚMERO DEL COLOR;"
Si deceas utilizar un color de fondo, deves borrar solo esta parte "background-image:url(URL DE IMAGEN);"



--------------------------------------------------------------------------------

Paso 2, el encabezado:

td.edit_header_full{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;height:PIXELES DE ALTURApx;}

Aqui se recomienda tener hecha una imagen de unos 921x104 ESTANDAR o una con mayor altura, pero si escojen esta ultima deve poner los pixeles exactos en donde dice :"PIXELES DE ALTURA"



--------------------------------------------------------------------------------

Paso 3, el menú:

td.nav_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 185x24 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 4, botón del menú sin pasar el mouse:

td.nav{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 185x33 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 5, botón del menú al pasar el mouse:

td.nav:hover{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 185x33 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 6, arriba del box:

td.sidebar_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 168x24 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 7, contenido de los box:

td.shouty{background-image:url(URL DE IMAGEN 1);background-color:#NÚMERO DEL COLOR;}
td.shouty2{background-image:url(URL DE IMAGEN 2);background-color:#NÚMERO DEL COLOR;}
td.shouty3{background-image:url(URL DE IMAGEN 3);background-color:#NÚMERO DEL COLOR;}
td.shouty4{background-image:url(URL DE IMAGEN 4);background-color:#NÚMERO DEL COLOR;}
td.shouty5{background-image:url(URL DE IMAGEN 5);background-color:#NÚMERO DEL COLOR;}

1ra Línea - Box1: Debemos conseguir una imagen de 168x800 aprox. o escoger un Color:
2da Línea - Box2: Debemos conseguir una imagen de 168x800 aprox. o escoger un Color:
3ra Línea - Box3: Debemos conseguir una imagen de 168x800 aprox. o escoger un Color:
4ta Línea - Box4: Debemos conseguir una imagen de 168x800 aprox. o escoger un Color:
5ta Línea - Box5: Debemos conseguir una imagen de 168x800 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 8, pie del box:

td.edit_rb_footer{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 168x27 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 9, arriba del contenido:

td.edit_content_top{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 568x38 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 10, centro del contenido:

td.edit_content{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

Debemos conseguir una imagen de 568x300 aprox. o escoger un Color:



--------------------------------------------------------------------------------

Paso 11, semi final del contenido:

td.edit_content_bottom{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_bottom:hover{background-image:url();}

1ra Línea: Debemos conseguir una imagen de 568x31 aprox. o escoger un Color:



2da Línea: Dejarla como está sino deformara la sección de Semifinal de contenido

--------------------------------------------------------------------------------

Paso 12, final del contenido:

td.edit_content_bottom2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

1ra Línea: Debemos conseguir una imagen de 568x34 aprox. o escoger un Color:



2da Línea: Dejarla como está sino deformara la sección de Semifinal de contenido

td.edit_below_nav{visibility:hidden;}
td.edit_rechts_sbg{visibility:hidden;}
--------------------------------------------------------------------------------

El codigo completo seria este:


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

<!--
body{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_navi_headbg{background-image:url();}
td.edit_rechts_cbg{background-image:url();}
td.edit_rechts_bottom{background-image:url();}
td.edit_header_full{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_header_full{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;height:PIXELES DE ALTURApx;}
td.nav{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.nav:hover{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.sidebar_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty3{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty4{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty5{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_rb_footer{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_top{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_bottom{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_bottom:hover{background-image:url();}
td.edit_content_bottom2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_below_nav{visibility:hidden;}
td.edit_rechts_sbg{visibility:hidden;}

--></style>

Recomendacion: si tienen imagenes, porfavor borren esta parte del codigo completo: "background-color:#NÚMERO DEL COLOR;" haci se les va a poder ver el codigo bien.

_________________
Volver arriba Ir abajo
Ver perfil de usuario http://www.mundo-mya.es.tl
 
Como Hacer tu Planilla con CSS
Ver el tema anterior Ver el tema siguiente Volver arriba 
Página 1 de 1.
 Temas similares
-
» como hacer espaditas de masilla epoxi ?
» COMO HACER UN BUEN CICLADO
» como hacer dijes de resina video
» Como hacer los ojales?
» Como hacer churritos de papel crepe

Permisos de este foro:No puedes responder a temas en este foro.
Mundo MyA :: Codigos y Tutoriales :: Tutoriales CSS-
Cambiar a: