Crear Mi Diseño
Bueno aqui yo pretendo explicar como tranformar su plantilla ice-blue
Primero que nada vamos a formarlo ok??
| Código: |
|
<style type="text/css">
<!-- |
con esto empezamos nuestro codigo ok??
ahora vamos con el encabezado hacemos un encabezado de 941 de ancho y de alto como ustedes quieran ok?
explico si es de 941x248 el codigo seria
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url de tu encabezado);background-color:;height:248px;} |
donde dice 248px se cambia por el alto que eligas ok?? ya formamos la primera parte del codigo que seria el encabezado
ahora vamos con el fondo de la web ok??
busca un fondo que ocupe toda la web y pegalo en el siguiente codigo
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(aqui la url del fondo);background-attachment: fixed} |
vamos formando el codigo verdad? ya tenemos el encabezado y el fondo
vamos con los botones ok??
ahora los botones los botones tienen que ser 185x33
ok??
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} |
vamos aprendiendo verdad?? ahora vamos a ver como cambiamos el titulo del menu de navegacion donde ponemos que diga menu y eso te acuerdas???
ok vamos a ver estas medidas son de 185x24 y el codigo seria
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la navegacion);} td.edit_below_nav{visibility:hidden;} td.edit_navi_headbg{background-image: none;} td.edit_rechts_sbg{visibility:hidden;} |
bueno ahora vamos con lo demas la proxima parte sera cambiar la parte de arriba de los box ^^ estas medidas son 168x24
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} |
upa ya vamos a formar el codigo xD
ahora la parte de arriba de donde va el contenido las medidas son 568x38
y vamos con el codigo
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} |
seguimos con el codigo ahora vamos donde va a ir el contenido osea el cetro del contenido recomendamos que sea de 568x100 y seguimos con el codigo
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} td.edit_content{background-image:url(Aqui la url de nuestro contenido);} |
muy bien ahora vamos con la parte del contenido este tiene que ser de 568x31
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} td.edit_content{background-image:url(Aqui la url de nuestro contenido);} td.edit_content_bottom{background-image:url(Aqui la url de la parte de abajo del contenido);} td.edit_content_bottom2{background-image: none;} |
eso ya vamos terminando el codigo
ahora con la parte de enmedio de los box osea donde escribimos tiene que ser de 168x400 hasme caso xD y el codigo seria
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} td.edit_content{background-image:url(Aqui la url de nuestro contenido);} td.edit_content_bottom{background-image:url(Aqui la url de la parte de abajo del contenido);} td.edit_content_bottom2{background-image: none;} td.shouty{background-image:url(aqui la url del box);} td.shouty2{background-image:url(aqui la url del box);} td.shouty3{background-image:url(aqui la url del box);} td.shouty4{background-image:url(aqui la url del box);} td.shouty5{background-image:url(aqui la url del box);} td.edit_rechts_cbg{background-image: url(URL);} |
ok?? ya falta poco por terminar ahora la parte de abajo de los box ED esta tiene que ser de 168x27
el codigo seria
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} td.edit_content{background-image:url(Aqui la url de nuestro contenido);} td.edit_content_bottom{background-image:url(Aqui la url de la parte de abajo del contenido);} td.edit_content_bottom2{background-image: none;} td.shouty{background-image:url(aqui la url del box);} td.shouty2{background-image:url(aqui la url del box);} td.shouty3{background-image:url(aqui la url del box);} td.shouty4{background-image:url(aqui la url del box);} td.shouty5{background-image:url(aqui la url del box);} td.edit_rechts_cbg{background-image: url(URL);} td.edit_rb_footer{background-image:url(aqui la url de la parte de abajo del box);} td.edit_rechts_bottom{background-image: url(URL);} |
este ultimo es para cuando pasen el mouse por la parte de abajo del contenido salga lo que tu quieras el tamaño es 570x40
los creditos o quien hiso el diseño yoque se pongan lo que quieran pero en imagen claro xD
y el codigo completo seria
| Código: |
|
<style type="text/css">
<!-- td.edit_header_full{background-image:url(Aqui la url del encabezado);background-color:;height:248px;} body{background-image:url(Aqui la url del fondo);background-attachment: fixed} td.nav{background-image:url(Aqui la url del boton sin efecto);} td.nav:hover{background-image: url(Aqui el efecto);} td.nav_heading{background-image:url(aqui la 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(Aqui la url de la parte de arriba de los box);} td.edit_content_top{background-image:url(Aqui la url de la parte de arriba del contenido);} td.edit_content{background-image:url(Aqui la url de nuestro contenido);} td.edit_content_bottom{background-image:url(Aqui la url de la parte de abajo del contenido);} td.edit_content_bottom2{background-image: none;} td.shouty{background-image:url(aqui la url del box);} td.shouty2{background-image:url(aqui la url del box);} td.shouty3{background-image:url(aqui la url del box);} td.shouty4{background-image:url(aqui la url del box);} td.shouty5{background-image:url(aqui la url del box);} td.edit_rechts_cbg{background-image: url(URL);} td.edit_rb_footer{background-image:url(aqui la url de la parte de abajo del box);} td.edit_rechts_bottom{background-image: url(URL);} td.edit_content_bottom:hover{background-image:url(aqui la url de la ultima imagen);} --></style> |
solo me dedico a que las personas aprendan no me hago responsable por lo que hagan con los codigos o hallan elegido el codigo y no hallan visto el tuto chauu
para que este codigo tenga efecto tienes que tener la plantilla ice-blue
POST DATA: NO ME HAGO RESPONSABLE DE NADA OK ESTO LO HACEN BAJO SU PROPIO RIESGO!!!