Renato escribió:A mi computadora se le metió un virus, uno yegando por el msn y bueno, como ya saben, tuvieron que formatear mi computadora y bueno, eliminaron mi programa de HTML y perdí todos los códigos... quisiera que alguien me pasara los códigos HTML y CSS, me quedé en la lección 5.
En el HTML-Kit no aparecen mis espacios Local ni Web... no sé cómo volver a ponerlos... por favor ayúdenme... ésta es mi pág hasta ahora...
Página de plantilla
y ésta...
Página principal
necesito ayuda para ponerme al día en los códigos de la lección 5...
Por ahora sólo podré rescatar los HTML de la plantilla y el index... pero me faltaría la hoja de estilos... no sé qué hacer...
Hola:
Realmente es un problema, ya que cuando uno hace esta web de ejemplo suele hacer alguna pequeña variación en alguna parte.
yo le pondré acá una forma de tener todas las páginas con sus carpetas.
Primero que nada, por ahora no utilice el HTML-KIT, solo cree una carpeta en su escritorio, y pongale por nombre mis-web .
Ahora dentro de esa carpeta cree otra carpeta y pongale por nombre- - web-ejemplo-cctw ---.
Ahora venga acá al foro y seleccione estos códigos y le da a copiar.
Luego minimice el foro, y en su ordenador pulse en un lugar vacío de su escritorio con el click derecho y en el desplegable que se abre, ponga el cursor en NUEVO, y en el desplegable que se abre pulse en DOCUMENTO DE TEXTO,.
Con ello se le creará en el escritorio un archivo de texto que tiene extensión txt. que se llamará Nuevo Documento de Texto.txt
Por tanto abre (seguramente doble click) ese archivo, ponga el cursor dentro de el y pulse click derecho y en le desplegable pulse en PEGAR.
Con ello, lo que habrá hecho ha sido pegar los códigos anteriormente copiados desde el foro.
Después de tener los códigos copiados allí, vaya arriba donde dice Archivo, pulse, y en el desplegable elija GUARDAR COMO, cuando se le abra la ventana del Guardar Como, vaya donde dice NOMBRE y en el cajetín donde seguramente dirá Nuevo Archivo de texto.txt, borre lo que hay allí y escriba index.html
Luego de ello, vaya más abajo y donde dice TIPO, a la derecha del cajetín hay una flecha, la pulsa y le hace click izquierdo a donde dice TODOS LOS ARCHIVOS.
Luego vaya arriba y donde dice GUARDAR EN elija guardarlo en el escritorio o mejor en la carpeta web-ejemplo-cctw.
Con eso podríamos decir que ya tiene el index.html.
Después de ello cierre y vaya otra vez al escritorio, que seguro que aún está el archivo de texto allí, así que le hace doble click y lo abre.
Cuando esté abierto, solo vaya a ARCHIVO pulse, y en el desplegable elija GUARDAR COMO.
Se le abrirá la ventana del Guardar Como, y abajo donde dice NOMBRE, borre lo que hay en el cajetín y escriba estilo-general.css, y más abajo donde dice TIPO, con la flecha de la derecha, púlsela y elija TODOS LOS ARCHIVOS .
Luego guardela en la misma carpeta en donde guardó el index.html, osea en la carpeta web-ejemplo-cctw.
Después de todo eso, venga al foro y copie los códigos que le dejo acá de la hoja de estilo general y vaya a su carpeta web-ejemplo-cctw y abra (doble click) la hoja de estilo general y pegue allí los códigos.
Con eso tendría usted una carpeta por nombre mis-web y dentro de ella una con nombre web-ejemplo-cctw, y dentro de la carpeta web-ejemplo-cctw tendría el archivo index.html y el archivo u hoja de estilo estilo-general.css.
Ahora dentro de la carpeta web-ejemplo-cctw cree la carpeta objetos.
Después de todo ello, dentro de la misma carpeta web-ejemplo-cctw cree las carpetas:
historia
discografia
conciertos
descargas
foros
souvenirs
Después de crear todas esas carpetas, cree dentro de cada una de ellas una carpeta objetos, y en el próximo spot o mensaje le daré los códigos de las páginas que van dentro de cada carpeta, por ahora le daré los códigos del index.html y de la hoja de estilo-general.css
INDEX.HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Página Oficial de la banda</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">
[contenido no disponible]</div>
<div id="publicidad">Bienvenidos a mi Web</div></div>
<div id="navegacion"><ul>
PortadaHistoriaDiscografíaConciertosDescargasForoSouvenirs</div>
<div id="contenido">
<h1>Bienvenidos a la página oficial de la banda</h1>
Bienvenido a la página oficial de la banda. En este portal puedes estar informado de todo lo referente al grupo, desde su historia hasta sus próximos conciertos, pasándo por su completa discografía, descarga de cosas interesantes e incluso por nuestra tienda online, en la que puedes encargar tu camiseta del grupo.No olvides visitarnos en el foro y dejar tus comentarios.
Gracias por la visita, esperamos verte pronto!.</p>
[correo eliminado]</p>
</div>
<div id="pie">
<div id="pieuno"><ul>Foro EjemploContactos<a href="#">Nos Enlazan</div>
<div id="piedos">pie dos</div>
<div id="pietres"><ul>DirectorioTopSite<a href="#">Mapa de la Web</div>
</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
ESTILO-GENERAL.CSS
*{text-indent:0px ; margin:0px ; padding:0px ; border:0px}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {text-align: center }
#global {width:800px ; margin:4px auto }
#curva-superior { background-image: url(objetos/curva-superior.gif) ;background-repeat: no-repeat ;width:800px ;height: 12px ;overflow : hidden }
#cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid ; height:85px}
#logotipo {width:280px ; float:left }
#publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px }
#navegacion {background-color: gray ; border: black 1px solid ; height:20px}
#navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
#navegacion ul { margin-left: 60px }
#contenido {width:auto;background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {width: 150px ; float:left ; text-align:left ; margin: 3px 10px 3px 3px ;background-image: url(objetos/menu-parte-inferior.gif); background-position: bottom ; padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 8px 4px 6px }
#menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;background-image: url(objetos/menu-parte-superior.gif);}
#pie {border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid ; height: 65px }
#pie li {list-style: none ;font-size: 12px }
#pieuno {float:left ; width:150px }
#piedos {float:left ; width:498px }
#pietres {float:left ; width:150px }
#pie a {color: blue; text-decoration:none ; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:black ; text-decoration:underline ; background-color: white }
#pie a:active {color:black}
#curva-inferior { background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat ; width:800px ; height: 12px ; overflow: hidden }
a {color: brown ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color: silver}
a:active {}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
Espero que por ahora le sirva, y cuando abra el HTML-KIT, pulse en la ficha workspace y en el desplegable que se abre ponga el cursor donde dice Añadir Carpeta/ServidorFTP y se le abrirá el desplegable en que tiene que pulsar donde dice Añadir Carpeta Local/Red...
Se le abrirá una ventana que se llama Add Folder.
Y allí donde dice Folder Path a la derecha del cajetín hay una carpeta pequeña, pulse en ella para que busque usted la carpeta que se llama web-ejemplo-cctw, cuando la encuentre, la selecciona con un click izquierdo y Acepta,
Despues vaya a donde dice Display Name, pulse dentro del cajetín, al hacerlo le aparecerá otra vez la ruta completa de la carpeta web-ejemplo-cctw, por tanto borre todo lo que hay allí en ese cajetín y escriba después web-ejemplo-cctw-local y pulsa en OK.
Con eso ya tiene su carpeta amarilla en el HTML-KIT, y llevará incluída la carpeta objetos y el index.html y la hoja de estilo-general.css.
POr ahora espero que le sirva, ya le daré los otros códigos de las otras páginas si es que los quiere
Saludos