Tareas de Tics

Télécharger au format txt, pdf ou txt
Télécharger au format txt, pdf ou txt
Vous êtes sur la page 1sur 3

Pagina 1<!

DOCTYPE html><html lang="es"><head></head><body>Este es un texto<br> Este


es otro texto<p>Este es un p�rrafo</p>Este es otro texto <hr><h1>Este es un t�tulo
h1</h1><h2>Este es un t�tulo h2</h2><h6>Este es un texto h6</h6></body></html>
Pagina 2<!DOCTYPE html><html lang="es"><head></head><body>Diego Alonso<br>M�rquez
<p>C�mero</p>09/02/2024 <hr><h1>Este es un t�tulo h1</h1><h2>Este es un t�tulo
h2</h2><h6>Este es un texto h6</h6></body></html>Pagina 3<!DOCTYPE html><html>
<head> <meta charset="utf-8"> <!--indica la codificaci�n utf8-->
<meta name="viewport" contenet="width=divice.width,initial-scale=1">
<title>Etiquetas de texto</title><style type="text/css"> body{background-
color:#9d2449; color:white;} p{font-family: Arial;font-size:30px}</style>
</head> <body> <strong><P>Este texto est� en Negritas</P></strong>
<a href="https://www.cobatab.edu.mx">Este texto es un enlace</a> <!--
Etiqueta para enlaces--> <ol> Lista numerada
<li>U<span style="color: #001aff;">no</span></li> <li>dos</li>
<li><strong>tres</strong></li> <li>cuatro</li> </ol>
<ul>Lista no numeradas <li>uno</li> <li>dos</li>
<li><strong>tres</strong></li> <li>cuatro</li> </ul>
</ul> </body></html>Pagina 4<!DOCTYPE html><html><head><title>Mi primera P�gina
Web</title></head><body><p>Colegio de Bachilleres de Tabasco</p><p> �Bienvenidos a
mi P�gina Web! </p><img src="Pasu hola.jpg"><img
src="bf0cdf1bfe1ef7b0c4174177dc5da999.jpg"></body></html>Pagina 5 - codigo base
para todas las actividades<!DOCTYPE html><html><head><meta charset="utf-8"><meta
name="viewport" content="width=device-width, initial-scale=1"><title></title>
</head><body></body></html>pagina 6<!DOCTYPE html><html><head><meta charset="utf-
8"><meta name="viewport" content="width=device-width, initial-scale=1">
<title>maquetaci�n web</title><style type="text/css">div { color: white;
margin-bottom: 20px; }#bloque1 { width: 200px; height: 200px; background-
color: #00ff00;}#bloque2 { width: 300px; height: 200px; background-color:
#ff0000;}</style></head><body><div id="bloque1"></div><div id="bloque2"></div>
</body></html>Pagina 7 - actividad del libro <!DOCTYPE html><html lang="es"><head>
<meta charset="utf-8"><meta http-equiv="refresh" content="3" /><meta
name="viewport" content="width=device-width, initial-scale=1"><link
rel="stylesheet" href="tables.css"><title>Tablas</title></head><body><table><tr
id="header" height="100px"><td colspan="2"><h1>ENCABEZADO</h1></td></tr><tr
id="nav" height="50px"><td colspan="2" bgcolor="aqua"><h2>BARRA DE NAVEGACI�N</h2>
</td></tr><tr height="200px"><td id="article1" width="75%"><h2>ART�CULO 1</h2></td>
<td id="aside" rowspan="2"><h2>BARRA IZQUIERDA</h2></td></tr><tr height="200px">
<td><h2>ART�CULO 2</h2></td></tr><tr id="footer" height="50px"><td colspan="2">
<h2>PIE DE P�GINA</h2></td></tr></table></body></html>Pagina 8<!DOCTYPE html><html>
<head> <meta charset="utf-8"> <!--indica la codificaci�n utf8--> <meta
name="viewport" content="width=device-width, initial-scale=1"> <title>Etiquetas
de texto </title> <style type="text/css"> body{ background-
color:#9d2449 ; color: white; } p{
font-family: Arial; font-size: 30px; } </style>
</head><body> <strong> <p>Este texto esta en Negritas</p> </strong>
<a href="https://www.cobatab.edu.mx">Este texto es un enlace</a>
<ol>Lista numerada <li>U<span style="color: #691193;">no</span>
</li> <li>dos</li> <li><strong>tres</strong></li>
<li>cuatro</li> </ol> <ul>Listas no numeradas <li>uno</li>
<li>dos</li> <li><strong>tres</strong></li>
<li>cuatro</li> </ul></body></html>index.html<!DOCTYPE html><html><head>
<meta charset="utf-8"> <meta name="viewport" content="width=device-width,
initial-scale=1"> <title>Mi estructura en html</title> <style type="text/css">
*{ margin:0; } body{
background-color: black; color: white; }
#contenido{ width: 80%; height: 30em;
margin: auto; background-color: #3284C8; border:
0px #0000; border-radius: 20px; } header{
width: 100%; height: 20%; background-color:
#7030A0; text-align:center; border: 0px #0000;
border-radius: 20px 20px 0px 0px; } nav{
width: 100%; height: 10%; background-color:
yellow; } section{ width: 100%;
height: 70%; background-color: lightgreen; }
#uno{ width: 50%; height: 100%;
background-color: darkcyan; float:left; } #dos{
width: 50%; height: 100%; background-color:
darkgoldenrod; float:left; border: 0px #0000;
border-radius: 50%; } </style></head><body> <div id="contenido">
<header>Diego Alonso M�rquez C�mero</header> <nav>Equipo 6</nav>
<section> <article id="uno"><p>Jos� Alberto L�pez C�rdova</p>
<p>Diego Alonso M�rquez C�mero</p> <p> Brayan Godinez Candelereo</p>
<p> Jos� Alfredo Jimenez Morales</p> <p>Andres Ortega Hernandez </p>
</article> <article id="dos"><img src="" width: 30%;
height: 30%; ></article> </section> </div></body></html>Pagina 10<!
DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport"
content="width=device-width, initial-scale=1"><title>Menpu de listas</title><style
type="text/css"> body{background-color: darkblue;}.men�{background-color:
yellowgreen;}.men� li{ display: inline-block;padding-top: 5px;width: 200px;
background-color: yellow;}.men� li a :hover{background-color:orange; text-
decoration:none;color: #fff;font-family: Arial;}</style></head><body><ul
class="men�"> <li><a href="Pasu hola.jpg">Home</a></li> <li><a
href="FB_IMG_1612154023703.jpg">Alumnos</a></li> <li><a
href="5f299ad5c0d02.jpeg">Docentes</a></li> <li><a
href="bf0cdf1bfe1ef7b0c4174177dc5da999.jpg">Galeria</a></li> <li><a
href="FB_IMG_1644046302370.jpg">Acerca de</a></li></ul></body></html>Pagina 12<!
DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport"
content="width=device-width, initial-scale=1"><title>Men� responsivo</title><style>
html,body{margin: 0; padding: 0; background-color: #ccc;}
ul.acordeon{ font-family: arial, sans-serif; -webkit-
transition: all .6s ease-in-out; transition: all .6s ease-in-out;}
ul.acordeon{width: 100%; /*personalizar sncho total*/ position:
absolute; bottom: 0; right: 0 ; display:
inline-block; list-style: none; font-size: 0 ;
background: #333;} img{width: 100%;}</style></head><body> <ul
class="acordeon"> <li> <h4>elemento 1</h4> <a
href="#"><img src="imagen 1.jpg"></a> </li> <li>
<h4>elemento 2</h4> <a href="#"><img src="imagen 2.jpg"></a>
</li> <li> <h4>elemento 3</h4> <a href="#"><img
src="imagen 3.jpg"></a> </li> <li> <h4>elemento 4</h4>
<a href="#"><img src="imagen 4.jpg"></a> </li> <li>
<h4>elemento 5</h4> <a href="#"><img src="imagen 5.jpeg"></a>
</li> </ul></body></html>Practica 3 - Actividad del libromis raices.html<!
DOCTYPE html><html lang="es"> <head> <meta charset="uft-8">
<title> ejemplo de estilo basico</title> <link rel="stylesheet"
type="text/css" href="estilos.css"> </head> <body> <h1>PONIENDO EN
L�NEA MIS RA�CES</h1> <h2>Artesan�as con material reciclado</h2>
<img src="tarro con velas.jpg" width="500" height="350"/> <p>Tarro
decorados con vela</p> <p>*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
*--*--*--*--*--*--*--*</p> <img src="porta retrato.jpg" width="400"
height="400"> <p>Porta retrato con conchas de rio o mar</p>
<p>*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*</p>
<img src="pi�ata.jpg" width="350" height="480"> <p>Pi�atas con cort�n
reciclado</p> <h3>LAS BELLEZAS DE NUESTRA TIERRA</h3> </body></html>
estilos.css - segunda parte de la practica 3body{background: lavenderblush; text-
align: center;}p{font-family: cursive; color: black; font-size: 20px;}h1{font-
family: Arial,Helvetica, sans-serif; color: darkred; font-size: 40px;}h2{font-
family: 'Times New Roman', Times, serif; color: midnightblue;font-size: 40px;}
h3{font-family: Georgia,'Times New Roman', Times, serif; color: olive; font-size:
25px;}ultima clase - sin terminar <!DOCTYPE html><html lang="es"><head> <meta
charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-
scale=1.0"> <title>Evento del mouse (hover)</title> <link rel="stylesheet"
type="text/css" href="mi.css"></head><body> <ul> <li> <a
href="#">Mi evento</a> </li> </ul></body></html>-----css del trabajo-----
body{background-color: #abcdef; text-align: #abcdef;}ul{width: 100%; display:
inline-block; margin: auto; transition: all .6s ease-in-out;}ul li a{width: 25%;
height: 10vh; background-color: #fafbfc;}ul li a{width: 25%; height:
10vh; background-color:
#fafbfc; text-decoration: none; font-family: Arial;}ul li a
hover{width: 35%; height: 20vh; background-color:
greenyellow; font-size: 30px;}

Vous aimerez peut-être aussi