viernes, 14 de noviembre de 2014
jueves, 30 de octubre de 2014
TAREA 7
TAREA 7
AL EDITARLO TENGO ESE PROBLEMA DEL MENU.
EN BLOG SE DESCOFIGURA PERO ESTE EL CODIGO DEL MENU DESPLEGABLE
<html>
<head>
<title>Menu Desplegable</title>
<style type="text/css">
* {
margin:0px;
padding:0px;
}
#header {
margin:auto;
width:500px;
font-family:Arial, Helvetica, sans-serif;
}
ul, ol {
list-style:none;
}
.nav > li {
float:left;
}
.nav li a {
background-color:#000;
text-decoration:none;
padding:10px 12px;
display:block;
background: -moz-linear-gradient(#93a613, #cbdd54);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #cbdd54),color-stop(1, #93a613));
background: -webkit-linear-gradient(#93a613, #cbdd54);
background: -o-linear-gradient(#93a613, #cbdd54);
background: -ms-linear-gradient(#93a613, #cbdd54);
background: linear-gradient(#93a613, #cbdd54);
}
.nav li a:hover {
background-color:#434343;
}
.nav li ul {
display:none;
position:absolute;
min-width:140px;
}
.nav li:hover > ul {
display:block;
}
.nav li ul li {
position:relative;
}
.nav li ul li ul {
right:-140px;
top:0px;
}
}
</style>
</head>
<body>
<div id="header">
<ul class="nav">
<li><a href="">Bienvenido</a></li>
<li><a href="">Personas</a>
<ul>
<li><a href="">Personas1</a></li>
<li><a href="">Personas2</a></li>
<li><a href="">Personas3</a></li>
<li><a href="">Personas4</a>
<ul>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">Musica</a>
<ul>
<li><a href="">Ballenato</a></li>
<li><a href="">Bachata</a></li>
<li><a href="">Regueton</a></li>
<li><a href="">folklore</a></li>
</ul>
</li>
<li><a href="">Videos</a></li>
<li><a href="">Radio</a></li>
<li><a href="">Mas...</a></li>
</ul>
</div>
</body>
</html>Menu Desplegable
AL EDITARLO TENGO ESE PROBLEMA DEL MENU.
EN BLOG SE DESCOFIGURA PERO ESTE EL CODIGO DEL MENU DESPLEGABLE
<html>
<head>
<title>Menu Desplegable</title>
<style type="text/css">
* {
margin:0px;
padding:0px;
}
#header {
margin:auto;
width:500px;
font-family:Arial, Helvetica, sans-serif;
}
ul, ol {
list-style:none;
}
.nav > li {
float:left;
}
.nav li a {
background-color:#000;
text-decoration:none;
padding:10px 12px;
display:block;
background: -moz-linear-gradient(#93a613, #cbdd54);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #cbdd54),color-stop(1, #93a613));
background: -webkit-linear-gradient(#93a613, #cbdd54);
background: -o-linear-gradient(#93a613, #cbdd54);
background: -ms-linear-gradient(#93a613, #cbdd54);
background: linear-gradient(#93a613, #cbdd54);
}
.nav li a:hover {
background-color:#434343;
}
.nav li ul {
display:none;
position:absolute;
min-width:140px;
}
.nav li:hover > ul {
display:block;
}
.nav li ul li {
position:relative;
}
.nav li ul li ul {
right:-140px;
top:0px;
}
}
</style>
</head>
<body>
<div id="header">
<ul class="nav">
<li><a href="">Bienvenido</a></li>
<li><a href="">Personas</a>
<ul>
<li><a href="">Personas1</a></li>
<li><a href="">Personas2</a></li>
<li><a href="">Personas3</a></li>
<li><a href="">Personas4</a>
<ul>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
<li><a href="">SubPersonas</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">Musica</a>
<ul>
<li><a href="">Ballenato</a></li>
<li><a href="">Bachata</a></li>
<li><a href="">Regueton</a></li>
<li><a href="">folklore</a></li>
</ul>
</li>
<li><a href="">Videos</a></li>
<li><a href="">Radio</a></li>
<li><a href="">Mas...</a></li>
</ul>
</div>
</body>
</html>
TAREA 5
TAREA 5
EN HTML5 ESTOS SON LOS QUE REMPLAZAN A LOS DIV
EN HTML5 ESTOS SON LOS QUE REMPLAZAN A LOS DIV
<!DOCTYPE html>
Es un DOCTYPE mucho más simplificado
que XHTML5 (cuyas reglas siguen siendo usadas) y te permite usar
todas las habilidades de HTML5 sin que nada de lo que ya tienes programado deje
de funcionar.
Las principales etiquetas HTML5 nuevas no tienen una
representación especial en pantalla. Todas se comportan como un <div> o
un <span>. Pero cada una tiene un significado semántico superior a un
simple div o span.
<header>
Hacer cosas como <div id=”header”> es un poco estúpido
cuando el 99% de los proyectos web tienen una cabecera. <header> está
diseñada para reemplazar la necesidad de crear divs sin significado semántico.
<hgroup>
Muchos headers necesitan múltiples títulos, como un blog que
tiene un titulo y un tagline explicando el blog. <hgroup> permite colocar
un h1, h2 y h3 dentro del header sin afectar el SEO, permitiendo usar otro h1
en el sitio.
En el HTML actual, sólo puedes usar h1 una vez por sitio o
el h1 pierde prioridad de SEO.
<nav>
Igual que <header>, <nav> está diseñado para que
ahí coloques la botonera de navegación principal. Puedes colocar cualquier
etiqueta dentro, aunque lo recomendado es usar listas <ul>.
<section>
Define un área de contenido única dentro del sitio. En un
blog, sería la zona donde están todos los posts. En un video de youtube, habría
un section para el video, uno para los datos del video, otro para la zona de
comentarios.
<article>
Define zonas únicas de contenido independiente. En el home
de un blog, cada post sería un article. En un post del blog, el post y cada uno
de sus comentarios sería un <article>.
<aside>
Cualquier contenido que no esté relacionado con el objetivo
primario de la página va en un aside. En un blog, obviamente el aside es la
barra lateral de información. En el home de un periódico, puede ser el área de
indicadores económicos.
<footer>
Es el pie de página y todo lo que lo compone.
TAREA 4
TAREA 4
<html>
<head>
<style type="text/css">
#head{
width: 100%;
height: 18%;
background-color: red;
}
#rigth{
width: 18%;
height: 80%;
background-color: yellow;
float: right;
}
#leght{
width: 18%;
height: 80%;
background-color: green;
float: left;
}
#center{
width: 70%;
height: 80%;
background-color: blue;
margin: 0 auto;
}
#pie{
width: 100%;
height: 18%;
background-color: orange;
position: relative;
}
</style>
<title>Divicion de div's</title>
</head>
<body>
<div id="head">
</div>
<div id="rigth">
</div>
<div id="leght">
</div>
<div id="center">
</div>
<div id="pie">
</div>
</body>
</html>
Divicion de div's
<html>
<head>
<style type="text/css">
#head{
width: 100%;
height: 18%;
background-color: red;
}
#rigth{
width: 18%;
height: 80%;
background-color: yellow;
float: right;
}
#leght{
width: 18%;
height: 80%;
background-color: green;
float: left;
}
#center{
width: 70%;
height: 80%;
background-color: blue;
margin: 0 auto;
}
#pie{
width: 100%;
height: 18%;
background-color: orange;
position: relative;
}
</style>
<title>Divicion de div's</title>
</head>
<body>
<div id="head">
</div>
<div id="rigth">
</div>
<div id="leght">
</div>
<div id="center">
</div>
<div id="pie">
</div>
</body>
</html>
ESTE ES UN EJEMPLO DE COMO TENIA QUE SALIR EL EJERCICIO
viernes, 24 de octubre de 2014
TAREA 2
TAREA 2
Usando el vínculo mailto: Enviando Datos del Formulario por Correo
Existe una forma bastante pobre de enviar por correo datos de una forma que solamente usa HTML: en la etiqueta <form>, fija el atributo action a "mailto:" URL, y el atributo enctype a "text/plain". La mayoría de los navegadores manejan esto correctamente, por ejemplo, enviar datos en un mensaje de correo. Por ejemplo,
Existen desventajas: no se puede controlar
el formato del texto enviado, y no se puede enviar una respuesta
de regreso al usuario. Asímismo no todos los navegadores
soportan este estilo de etiqueta <form>.
Usando el vínculo mailto: Enviando Datos del Formulario por Correo
Existe una forma bastante pobre de enviar por correo datos de una forma que solamente usa HTML: en la etiqueta <form>, fija el atributo action a "mailto:" URL, y el atributo enctype a "text/plain". La mayoría de los navegadores manejan esto correctamente, por ejemplo, enviar datos en un mensaje de correo. Por ejemplo,
<form action="mailto:me@myhost.com"
enctype="text/plain">
|
Suscribirse a:
Comentarios (Atom)