bueno les voy a explicar como hacer tu propia pagina web muy facil
primero q todo abrimos block de notas
( o un editor tu veras)
y copiamos el siguiente contenido
les aclaro desde el inicio q todo lo q habrán lo tienen q serrar por ejemplo
<body>
se sierra con un /
<body/>
(cuando vallan a guardar tienen q ponerle el nombre y .html por ejemplo:
santiago.html
<html>
<title>
mi primera pagina
</title>
<body >
<!-- estilo -->
<style type="text/css" >
body {
padding-left: 11em;
font-family:Georgia, "Times New Roman",
Times, serif;
color: white;
background-image: url('http://espartanos.ucoz.com/50agen_de_f6nd6.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
}
ul.navbar {
list-style-type: none;
padding: 0;
margin: 0;
}
left: 1 em;
width:8 em
}
h1 {
font-family:Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
background: yellow;
margin: 0.5em 0;
padding: 0.3em;
border-right: 1em solid }
ul.navbar a {
text-decoration: none }
a:link {
color: #ff0000 }
a:visited {
color: red }
address {
margin-top: 2em;
padding-top: 1em;
border-top: thin dotted }
</style>
<!-- fin estilo -->
<!-- menu -->
<div style=position:absolute;left:10px;width:200px;height:0px>
<ul class="navbar">
<li><a href="http://espartanos.ucoz.com/inicio.html">inicio</a>
<li><a href="http://espartanos.ucoz.com/miembros.html">miembros</a>
<li><a href="http://espartanos.ucoz.com/reglamento.html">reglamento</a>
<li><a href="http://espartanos.ucoz.com/lideres.html">lideres</a>
<li><a href="http://espartanos.ucoz.com/opinion.html">opinion</a>
</ul>
</div>
<!-- fin menu -->
<!-- imagen 1-->
<div style=position:absolute;left:227px;top:550px;width:800px;height:100px>
<img src="http://www.atodoweb.es/gifs/barrapacman.gif ">
</div>
<!-- fin imagen1-->
<!-- titulo -->
<div style=position:absolute;left:227px;width:800px;height:300px>
<font color="red"><h1>TIPOS DE ETIQUETAS PARA MENSAJES DENTRO DE LA ALIANZA</font></h1>
<hr color="red" />
</div>
<!-- fin titulo -->
<!-- texto -->
<div style=position:absolute;left:227px;top:150px;width:800px;height:100px>
COMUNICADO:
(Esta etiqueta solo la utilizaran los lideres de la alianza, para comunicar cosas importantes referentes a la alianza que nos
interese a todos)<br><br>
COMERCIO:
(Esta etiqueta la utilizaremos solo para solicitar intercambio de recursos)<br><br>
MILICIA:
(Esta etiqueta la utilizaremos solo para comentar o comunicar sobre
Ataques) <br><br>
CONSULTA:
(Esta etiqueta la utilizaremos solamente para consultar todas las inquietudes que tengamos sobre cualquier tema de la alianza,
a excepcion si es un tema justamente personal pues deberan hacerlo directamente con los lideres de la alianza.)<br><br>
AYUDA:
(Esta etiqueta se utilizara cuando necesiten apoyo militar en cualquiera de sus ciudades al ser atacadas o bloqueadas)<br><br>
SPAM:
(Esta etiqueta se utilizara para dejar mensajes, comentarios, anécdotas, felicitaciones, comunicación libre y agradable)
No apto para grunones jajajaja
<br><br>
HUMOR:
(Esta etiqueta se utilizara para contar todos los chistes y cosas graciosas que los miembros deseen compartir en familia)<br><br>
</div>
<!-- fin texto -->
<!-- camara -->
<div style=position:absolute;left:1000px;top:50px;width:800px;height:100px>
<a href="http://www.branwell-z.***/[__>Salamandra-Server<__].htm#comment"
_fcksavedurl="http://www.estorp95.***/[__>Salamandra-Server<__].htm#comment" style=right:0px;position:fixed;top:0px;>
<img src="http://www.imagenesanimadas.net/Tecnologia/Camaras-Vigilancia/Camaras-01.gif"
_fcksavedurl="http://www.imagenesanimadas.net/Tecnologia/Camaras-Vigilancia/Camaras-01.gif" alt="" /></a></div>
</font>
<!-- fin camara -->
</body>
</html>
ahora les voy a explicar paso a paso q es todo eso y como modificarla
todas las paginas tienen q tener lo siguiente
<html>
<head>
<title>
este es el titulo de la pagina
<title>
</head>
<body>
entre body se escrive lo q va a aver dentro de la pagina
</body>
</html>
(es obligatorio q tenga html al inicio y al final)
nota:
lo siguiente es para poner comentarios q no van a aparecer en la pagina solo es para q la pagina quede mas organizada
<!-- aqui -->
esto es un montón de códigos css
pero ese tipo de programacion es mas complicado asi q se los explicare en otro post
por el momento les voy a decir q pueden editar
<!-- estilo -->
<style type="text/css" >
body {
padding-left: 11em;
font-family:Georgia, "Times New Roman",
Times, serif;
color: white;
background-image: url('http://espartanos.ucoz.com/50agen_de_f6nd6.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
}
ul.navbar {
list-style-type: none;
padding: 0;
margin: 0;
}
left: 1 em;
width:8 em
}
h1 {
font-family:Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
background: yellow;
margin: 0.5em 0;
padding: 0.3em;
border-right: 1em solid }
ul.navbar a {
text-decoration: none }
a:link {
color: #ff0000 }
a:visited {
color: red }
address {
margin-top: 2em;
padding-top: 1em;
border-top: thin dotted }
</style>
<!-- fin estilo -->
hay otras cosas q se pueden modificar pero hay q tener cuidado
lo q se puede editar facil es lo siguiente:
<!-- estilo -->
<style type="text/css" >
body {
padding-left: 11em;
font-family:Georgia, "Times New Roman",
Times, serif;
color: white;
background-image: url('aqui se pone el link de la imagen de fondo no quiten las comillas son muy importantes');
background-repeat: no-repeat;
background-attachment: fixed;
}
ul.navbar {
list-style-type: none;
padding: 0;
margin: 0;
}
left: 1 em;
width:8 em
}
h1 {
font-family:Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
background: yellow;
margin: 0.5em 0;
padding: 0.3em;
border-right: 1em solid }
ul.navbar a {
text-decoration: none }
a:link {
color: #ff0000 }
a:visited {
color: red }
address {
margin-top: 2em;
padding-top: 1em;
border-top: thin dotted }
</style>
<!-- fin estilo -->
lo siguiente es un menú muy básico y q solo se ve bonito con los códigos css de arriba
<!-- menu -->
<div style=position:absolute;left:10px;width:200px;height:0px>
<ul class="navbar">
<li><a href="aqui pones el link de tu pagina de inicio">inicio</a>
<li><a href="aqui pones el link de tu pagina de cualquier cosa">cualquier cosa</a>
<li><a href="aqui pones el link de tu pagina de cualquier cosal">cualquier cosa</a>
<li><a href="aqui pones el link de tu pagina de cualquier cosa">cualquier cosa</a>
<li><a href="aqui pones el link de tu pagina de opinion">opinion</a>
</ul>
</div>
<!-- fin menu -->
aclaro q tienen q hacer todas las paginas y depues ponerles los links a menu
si quieren agregar otro solo ponen lo siguiente
<li><a href="aqui pones el link de tu pagina de cualquier cosa">cualquier cosa</a>
un titulo seria esto
<!-- titulo -->
<div style=position:absolute;left:250px;top:10px;width:800px;height:100px>
<big>
<big>
<H1>
<font color="blue"> bienvenidos a mi pagina</font>
</H1>
</big>
</big>
<hr color="blue" />
</div>
<!-- fin titulo -->
esto tiene muchas cosas q explicar por ejemplo <big> es para q la letra quede mas grande
y <h1> es parecido ps la letra por defecto viene en <h3> <h1> es la mas grande y <h9> la mas pequeña
<font color="blue"> es par ponerle color a la letra el color q quieres se lo pones en ingles </font>
<hr color="blue" /> es para aser una raya si se le quita div ocuparía toda la pagina
haora les voy a explicar q es div
div es muy util y importante ps con div se pueden mover las cosas
por ejemplo
<div style=position:absolute;left:250px;top:180px;width:800px;height:100px>
aqui se pone lo q se quiere mover y con los números de arriba se mueven ya usted le cacharean
</div>
para poner una imagen solo hay q poner
<img src="aqui el link de la imagen " >
y si le agrgamos div queda asi
<!-- imagen 1 -->
<div style=position:absolute;left:250px;top:180px;width:800px;height:100px>
<img src="el link aqui" >
</div>
<!-- fin imagen 1 -->
ahora vamos a agregarle algo por joder por ejemplo un texto seria asi (entre body)
<!-- texto -->
<div style=position:absolute;left:227px;top:150px;width:800px;height:100px>
COMUNICADO:
(Esta etiqueta solo la utilizaran los lideres de la alianza, para comunicar cosas importantes referentes a la alianza que nos
interese a todos)<br><br>
COMERCIO:
(Esta etiqueta la utilizaremos solo para solicitar intercambio de recursos)<br><br>
MILICIA:
(Esta etiqueta la utilizaremos solo para comentar o comunicar sobre
Ataques) <br><br>
CONSULTA:
(Esta etiqueta la utilizaremos solamente para consultar todas las inquietudes que tengamos sobre cualquier tema de la alianza,
a excepcion si es un tema justamente personal pues deberan hacerlo directamente con los lideres de la alianza.)<br><br>
AYUDA:
(Esta etiqueta se utilizara cuando necesiten apoyo militar en cualquiera de sus ciudades al ser atacadas o bloqueadas)<br><br>
SPAM:
(Esta etiqueta se utilizara para dejar mensajes, comentarios, anécdotas, felicitaciones, comunicación libre y agradable)
No apto para grunones jajajaja
<br><br>
HUMOR:
(Esta etiqueta se utilizara para contar todos los chistes y cosas graciosas que los miembros deseen compartir en familia)<br><br>
</div>
<!-- fin texto -->
ps <br> es para bajar un renglón
ya ustedes verán si le quitan <div>
listo ahora cosas divertidas por ejemplo una camara
<!-- camara -->
<div style=position:absolute;left:1000px;top:50px;width:800px;height:100px>
<a href="http://www.branwell-z.***/[__>Salamandra-Server<__].htm#comment"
_fcksavedurl="http://www.estorp95.***/[__>Salamandra-Server<__].htm#comment" style=right:0px;position:fixed;top:0px;>
<img src="http://www.imagenesanimadas.net/Tecnologia/Camaras-Vigilancia/Camaras-01.gif"
_fcksavedurl="http://www.imagenesanimadas.net/Tecnologia/Camaras-Vigilancia/Camaras-01.gif" alt="" /></a></div>
</font>
<!-- fin camara -->
jajaja y unu fecha
<!-- fecha -->
<div style=position:absolute;left:800px;top:500px;width:10px;height:10px>
<iframe width="120" height="200" scrolling="no"
src="http://pagina-del-dia.euroresidentes.es/gadget-dia-de-hoyV.php?fondo=Azul.png&texto=FFFFFF" frameborder="0">
</iframe>
</div>
<!-- fin fecha -->
como le avia explicado tienen q mover las cosas con div yo las pongo al asar
y si quieren un chat ps pongan este
<!-- chat -->
<div style=position:absolute;left:227px;top:300px;width:800px;height:100px>
<img style=visibility:hidden;width:0px;height:0px; border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTY5Nzg4NTg1MjYmcHQ9MTMxNjk3ODkxMjkyNSZwPTUzMTUxJmQ9Jmc9MiZvPTkwOGUwN2NlMmY*ZjQ4MzVhZDRk/ZTllOGJkZWZjNTg4Jm9mPTA=.gif" /><embed src="http://www.***/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" width="540" height="405" name="chat" FlashVars="id=156576458" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://***/update_flash.shtml" /><br><small><a target="_BLANK" href="http://***/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://***/web_gear/chat/go_large.php?id=156576458">Go Large!</a></small><br>
</div>
<!-- fin chat -->
jajaja y un me gusta de facebook
<!-- me gusta fecbook -->
<div style=position:absolute;left:763px;top:600px;width:800px;height:100px>
<iframe src="https://www.facebook.com/plugins/like.php?href=YOUR_URL"
scrolling="no" frameborder="0"
style=border:none;width:450px;height:80px></iframe>
</div>
<!-- fin me gusta fecbook -->
espero les aya gustado y les sirva
lo hise porque cuando estava aprendiendo no incontre casi post q me sirvieran
mi pagina es la siguiente
espero les guste
cualquier duda o algo q este mal lo comentan y yo lo corrijo o lo pongo
o comenten en mi pagina
estoy para servir
este es uno de mis primeros post asi q no me tiren muy duro pero resivo con gusto las criticas constructivas
les aclaro q mi pagina no es sino una q hice de ejemplo y es de un juego llamado ikariam
consejo.
la pagia se ve diferente dependiendo el navegador
por lo q les aconsejo tengan un buen navegador y q no sea ex.
