Sei sulla pagina 1di 21

INSTITUTO TECNOLOGICO DE MACUSPANA

NOMBRE DE LA MATERIA:
DISEÑO WEB

NOMBRE DEL DOCENTE:


JORGE CHICO POZO

NOMBRE DEL ALUMNO:


JORGE CHICO POZO

GRADO: 7º

FECHA DE ENTREGA: 25/09/2017


MI PRIMERA PAGUINA WEB
PRACTICA 1

<! DOCTYPE html>


<html lang="es">
<head>
<meta charset="UTF-8>
<title> Mi primera pagina</title>
</head>
<body></body>
</html>
PRACTICA 2
<!DOCTYPE html>
<html>
<title> </title>
</head>
<body>
<p> MI PAGINA EN BLANCO</p>
<script type= "text/javaScript">
var nombre;
n=prompt("Ingrese su nombre");
document.write("hola" +n);
function abrir() {
open('pagina.html','','top=300,left=300,width=300,height=300') ;
<body onload="abrir()">
}
</script>
</body>
</html>
PRACTICA 3
<! DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8>
<title>Titulo de la pagina</title>
</head>
<body>
<a href="http://www.google.com">Google</a>
</body>
</html>
PRACTICA 4
<! DOCTYPE html> // Sera compatible con navegadores más antiguos actuales y
que trabaja con html 5
<html lang="es"> // Idioma con que se trabaja es español
<head> //
<meta charset="UTF-8> // Simbologia que usamos en el idioma español
<title>Titulo de la página</title> // Titulo de la pagina
</head>
<body></body> // En la etiqueta body empezamos a incrustrar todas las
instrucciones
</html>

PRACTICA 5
<!DOCTYPE html>
<! -- Todo: a?adir la etiqueta lang -->
<html>
<head>
<meta charset="UTF-8">
<title>Ejemplo con etiquetas basicas</title>
<style type="text/css">
body {
backgroud: #CCC;
color: #FFA;
font-family: verdana, arial, sans-serif;
font-size: 5em;
}
</style>
</head>
</html>
PRACTICA 6
<!DOCTYPE html>
<! -- Todo: añadir la etiqueta lang -->
<html>
<head>
<meta charset="UTF-8">
<title>Ejemplo con etiquetas basicas</title>
</head>
<body>
<h1>Etiquetas HTML</h1>
<p>
Este ejemplo muestra como combinar algunas de lasetiquetas mas basicas
de HTML5. <br>
Recuerda que <strong> es importante entender la diferencias entre ellas
</strong>.
</p>
<h2>Etiqueta ul+li</h2>
<p>
Si listamos personas nominadas a los Oscars dado que el orden no altera el
significado, debemos usar <em>ul</em>
</p>
<ul>
<li>David Verdaguer</li>
<li>Jesus Castro</li>
<li>Israel Elejalde</li>
<li>Dani Rovira</li>
</ul>
<h2>Etiqueta ol+li</h2>
<p>
En el caso de que estemos listando elementos donde elorden es importante,como
por ejemplo la clasificacion de un mundial de futbol, debemos usar <em>ol</em>.
</p>
<ol>
<li>España</li>
<li>Paises Bajos</li>
<li>Alemania</li>
<li>Uruguay</li>
</ol>
</body>
</html>
PRACTICA 7
<!DOCTYPE html >
<html>
<head>
<title>Mi primera pagina con estilo</title>
<style type="text/css">
body{
fond-family: Georgia, "Times New Roman",
Times, serif;
color: purple;
background-color: #d8da3d }
h1{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif}
</style>
</head>
<!-- Menu de navegacion del sitio -->
<ul class="navbar">
<li><a href="indice.html">Pagina principal</a>
<li><a href="meditaciones.html">Meditacionea</a>
<li><a href="ciudad.html">Mi ciudad</a>
<li><a href="enlaces.html">Enlaces</a>
</ul>
<!-- Contenido prinicipal -->
<h1> Mi primera pagina con estilo </h1>

<p>!Bienvenido a mi primera paigina con estilo!

<p>No tiene imagenes, pero tiene estilo.


Tambien tiene enlaces, aunque no te lleven a ningun sitio...

<p>Deberia haber mas cosas aqui, pero todavia no se que poner.

<!-- Firma y fecha de la pagina, !solo por cortesia! -->


<address>Creada el 1 de semptiembre de 2017<br>
por mi mismo.</address>
</body>
</html>
PRACTICA 8
<!DOCTYPE html>
<html>
<head>
<title>Mi primera página con estilo</title>
<link rel="stylesheet" href="miestilo.css">
<style type="text/css">
body {
padding-left: 11em;
font-family: Georgia, "Times New Roman",
Times, serif;
color: purple;
background-color: #d8da3d }
list-style-type: none;
padding: 0;
margin: 0;
ul.navbar {
position: absolute;
top: 2em;
left: 1em;
width: 9em }
h1 {
font-family: Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
background: white;
margin: 0.5em 0;
padding: 0.3em;
border-right: 1em solid black }
ul.navbar a {
text-decoration: none }
a:link {
color: blue }
a:visited {
color: purple }
address {
margin-top: 1em;
padding-top: 1em;
border-top: thin dotted }
</style>
</head>
</head>

<body>
<!-- Menú de navegación del sitio -->
<ul class="navbar">
<li><a href="indice.html">Página principal</a>
<li><a href="meditaciones.html">Meditaciones</a>
<li><a href="ciudad.html">Mi ciudad</a>
<li><a href="enlaces.html">Enlaces</a>
</ul>

<!-- Contenido principal -->


<h1>Mi primera página con estilo</h1>

<p>¡Bienvenido a mi primera página con estilo!

<p>No tiene imágenes, pero tiene estilo.


También tiene enlaces, aunque no te lleven a
ningún sitio…

<p>Debería haber más cosas aquí, pero todavía no sé


qué poner.

<!-- Firma y fecha de la página, ¡sólo por cortesía! -->


<address>Creada el 5 de abril de 2004<br>
por mí mismo.</address>
</body>
</html>
PRACTICA 9
<!DOCTYPE html>
<html>
<title> </title>
</head>
<body>
<p> MI PAGINA EN BLANCO</p>
<script type= "text/javaScript">
var nombre;
n=prompt("Ingrese su nombre");
document.write("hola" +n);
alert("hola" +n)
</script>
</body>
</html>
PRACTICA 10
<!DOCTYPE html>
<html>
<head>
<title> </title>
</head>
<body>
<p> Mi Primera Pagina Web Joloche </p>
<script type="text/javascript">
var a,b,s;
a=prompt("A:");
b=prompt("B:");
s= parseInt(a)+parseInt(b);

document.write("La suma es "+s);


if(a>b)
{
document.write("El mayores "+a);
}
else
{
document.write(" El mayor es "+b);
}
for(i=1; i<10; i++)
{
document.write(" , "+i);
}
</script>
PRACTICA 11
<!DOCTYPE html>
<html lang="es">
<head>
<title>Codigo JavaScript</title>
</head>
<body>
<script type="text/javaScript">
var n1, n2;
n1=prompt("Digito 1");
n2=prompt("Digito 2");
if(parseInt(n1)==parseInt(n2))
{
documet.write("son iguales");
}
else
if (parseInt(n1)>parseInt(n2))
{
documet.write("El mayor es" + n1);
}
else
{
documet.write("El mayor es" + n2);
}
</script>
</body>
</html>
PRACTICA 12
<html lang="es">
<head>
<title>Codigos JavaScript </title>
</head>
<body>
<script type="text/javaScript">
var i,j,n;
n=prompt("n:");
for(i=1;i<=n;i++)
{
document.write("<br />");
for(j=1; j<=i;j++)
{
document.write(" * ");
}

}
PRACTICA 13
<!DOCTYPE html>
<html lang="es">
<head>
<title>Codigos JavaScript </title>
</head>
<body>
<script type="text/javaScript">
function sumar(uno,dos)
{
var total;
total=parseInt(uno.value)+parseInt(dos.value);
alert ("El valor es"+total);
}
</script>
<form name="prueba">
uno<input type="text" name="uno">
dos<input type="text" name="dos">
<input type="button" name="total" value="total" onclick="sumar(uno,dos)">
</form>
</body>
</html>

Potrebbero piacerti anche