- <li type="circle">Esto es un tipo de viñeta redonda.</li>
- <li type="square">Esta es una viñeta cuadrada.</li>
- <li type="disc">Y este es otro tipo de viñeta redonda.</li>
Un servicio de "El Conventillo Web"
Header Background
Header Background Image. Ideal width 1600px with.
sábado, 24 de abril de 2010
Código HTML: Poner viñetas en las listas
Los siguientes elementos en las etiquetas de listas sirven para poner viñetas.
viernes, 23 de abril de 2010
Código HTML: Libro de visitas
El siguiente código HTML crea un libro de visitas para tu página web.
<H2>Libro de visitas de www.tuweb.com</H2>
<FORM ACTION="mailto:tunombre@tuservidor.com" METHOD="post">
<TABLE>
<TD ALIGN=RIGHT>Nombre:</TD>
<TD><INPUT type="text" size=36 name="nombre"></TD>
<TR><TD ALIGN=RIGHT>Direccion E-mail:</TD>
<TD><INPUT type="text" size=36 name="direccion"></TD>
<TR><TD ALIGN=RIGHT>¿Cómo llegaste hasta esta pagina?</TD>
<TD><INPUT type="text" size=36 name="procedencia"></TD>
<TR><TD ALIGN=RIGHT>Tus comentatios:</TD>
<TD><TEXTAREA rows=5 cols=30 name="comentarios"></TEXTAREA></TD>
</TABLE>
<INPUT type="reset" value="Borrar todo"> <INPUT type="submit" value="Enviar">
</FORM>
<H2>Libro de visitas de www.tuweb.com</H2>
<FORM ACTION="mailto:tunombre@tuservidor.com" METHOD="post">
<TABLE>
<TD ALIGN=RIGHT>Nombre:</TD>
<TD><INPUT type="text" size=36 name="nombre"></TD>
<TR><TD ALIGN=RIGHT>Direccion E-mail:</TD>
<TD><INPUT type="text" size=36 name="direccion"></TD>
<TR><TD ALIGN=RIGHT>¿Cómo llegaste hasta esta pagina?</TD>
<TD><INPUT type="text" size=36 name="procedencia"></TD>
<TR><TD ALIGN=RIGHT>Tus comentatios:</TD>
<TD><TEXTAREA rows=5 cols=30 name="comentarios"></TEXTAREA></TD>
</TABLE>
<INPUT type="reset" value="Borrar todo"> <INPUT type="submit" value="Enviar">
</FORM>
Código javascript: Aumentar el texto (lupa)
El texto, palabra a palabra al pasar una lupa sobre ellas.
<Html>
<Head><Title>Página de contenido dinámico</title></head>
<Body onmousemove=\"Agranda()\">
<Script language=\"JavaScript\">
<!--
function Agranda(){
var MiTexto= document.body.createTextRange();
var TextoBoton= Boton.createTextRange();
document.body.style.cursor=\\\'sw-resize\\\';
TextoBoton.text=\"\";
posX = window.event.x;
MiTexto.moveToPoint(posX,window.event.y);
MiTexto.expand(\"word\",1);
TextoBoton.text=MiTexto.text;
if (posX > document.body.clientWidth*0.50){
posX=posX-150;}
Boton.style.left=posX;
Boton.style.top=window.event.y;
Boton.style.visibility=\\\'visible\\\';
return true;
} // de la función
//-->
</script>
<P Style=\"font-size:24\">
Este documento está diseñado para poder ser leído aunque se tengan determinados problemas visuales
</p>
<Button Id=\"Boton\" Style=\"position:absolute; font-family:Arial; font-size:48; background:cyan; visibility:hidden\">
</button>
</body>
</html>
<Html>
<Head><Title>Página de contenido dinámico</title></head>
<Body onmousemove=\"Agranda()\">
<Script language=\"JavaScript\">
<!--
function Agranda(){
var MiTexto= document.body.createTextRange();
var TextoBoton= Boton.createTextRange();
document.body.style.cursor=\\\'sw-resize\\\';
TextoBoton.text=\"\";
posX = window.event.x;
MiTexto.moveToPoint(posX,window.event.y);
MiTexto.expand(\"word\",1);
TextoBoton.text=MiTexto.text;
if (posX > document.body.clientWidth*0.50){
posX=posX-150;}
Boton.style.left=posX;
Boton.style.top=window.event.y;
Boton.style.visibility=\\\'visible\\\';
return true;
} // de la función
//-->
</script>
<P Style=\"font-size:24\">
Este documento está diseñado para poder ser leído aunque se tengan determinados problemas visuales
</p>
<Button Id=\"Boton\" Style=\"position:absolute; font-family:Arial; font-size:48; background:cyan; visibility:hidden\">
</button>
</body>
</html>
Código javascript: No dejar seleccionar el texto de nuestra página web
Con el siguiente código (que obviamente nosotros tenemos desactivado), impedimos que los visitantes de nuestra página copien texto de la misma para pegarlo en otro lado.
<script language="Javascript">
<!-- Begin
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
// End -->
</script>
<script language="Javascript">
<!-- Begin
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
// End -->
</script>
Código javascript: listado de enlaces cambiando el color de resalte
El siguiente javascript sirve para que el color de los enlaces vaya cambiando, logrando de este modo llamar más la atención sobre los lectores
<body>
<p><script>
function highlight(which,color){
if (document.alldocument.getElementById)
which.style.backgroundColor=color}
</script>
<a href=http://tuweb onMouseover="highlight(this,'yellow')" onMouseout="highlight(this,document.bgColor)">LosRecursosGratis.com</a>
<p>
<a href="../../promocion/intercambio.htm" onMouseover="highlight(this,'#00FF00')" onMouseout="highlight(this,document.bgColor)">Intercambio de banners</a>
<p>
<a href="http://new.topsitelists.com/bestsites/losrecursosgratis/topsites.html" onMouseover="highlight(this,'#FF00FF')" onMouseout="highlight(this,document.bgColor)">Ranking Top Webmasters</a>
</body>
<body>
<p><script>
function highlight(which,color){
if (document.alldocument.getElementById)
which.style.backgroundColor=color}
</script>
<a href=http://tuweb onMouseover="highlight(this,'yellow')" onMouseout="highlight(this,document.bgColor)">LosRecursosGratis.com</a>
<p>
<a href="../../promocion/intercambio.htm" onMouseover="highlight(this,'#00FF00')" onMouseout="highlight(this,document.bgColor)">Intercambio de banners</a>
<p>
<a href="http://new.topsitelists.com/bestsites/losrecursosgratis/topsites.html" onMouseover="highlight(this,'#FF00FF')" onMouseout="highlight(this,document.bgColor)">Ranking Top Webmasters</a>
</body>
Código javascript: modificar el color de la barra de desplazamiento
Con el siguiente código (que no es un javascript propiamente dicho), podemos cambiar el color de la barra de desplazamiento:
Tenes que copiar el código dentro del Tag HEAD
<style type="text/css">
BODY {
scrollbar-face-color: #CC3333;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #999999;
scrollbar-darkshadow-color: #505050;
scrollbar-track-color: #cccccc;
scrollbar-arrow-color: #cccccc;
}
</style>
Tenes que copiar el código dentro del Tag HEAD
<style type="text/css">
BODY {
scrollbar-face-color: #CC3333;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #999999;
scrollbar-darkshadow-color: #505050;
scrollbar-track-color: #cccccc;
scrollbar-arrow-color: #cccccc;
}
</style>
Código HMTL: poner un icono al lado de la URL de tu Web
El siguiente código HTML ubica al lado de la URL de tu web en la barra del navegador, el icono que vos desees.
Entre las tags <HEAD> y </HEAD> pones el siguiente código;.
<LINK REL="SHORTCUT ICON" HREF="icono.ico">
Código JavaScript: agregar a favoritos una página web
Si queremos facilitar la vuelta a nuestra página a quienes nos visiten, podemos hacer un link que agregue a sus favoritos nuestra página, usando javascript. El código es el siguiente:
<a href="javascript:window.external.AddFavorite('http://www.tudireccionweb.com,'Descripción de mi Web...');"><b>Agrega esta web a tus favóritos!</b></a>
Suscribirse a:
Entradas (Atom)