SECUNDARIA 21 JOVITA A. ELGUERO
  • INICIO
  • PRIMER GRADO
    • Español 1 evaluación
    • TEST DIAGNÓSTICO 1
    • Matemáticas 1 evaluación
    • Actividades
    • Computación básica
  • SEGUNDO GRADO
    • Integración curricular 2025
    • Español 2 evaluación
    • Matemáticas 2 evaluación
    • TEST DIAGNÓSTICO 2
    • Chuka
    • Repaso Teclado
  • TERCER GRADO
    • TEST DIAGNÓSTICO 3
    • PruebaT Bachillerato
  • Ejercicios
    • Edpuzzle
    • Habilidad matematica
    • REBOTE
    • INFORMATICA
    • Lectoescritura 1
    • Integración curricular 2024
    • Blog Español

PROYECTO DE INVESTIGACIÓN

5/28/2023

 
  • Realiza tu proyecto de investigación de la problemática que elegiste.
  • Descarga información e imágenes, guárdalas en una carpeta.
  • Descarga el siguiente documento.
  • Modifícalo para introducir ahí tu información e imágenes.
  • Guarda todo en una misma carpeta y envíala a tu profesor.
Colores

<html>
<head>
<style>
html {
font-size: 10px;
font-family: 'Open Sans', sans-serif;
}
h1 {
font-size: 60px;
text-align: center;
}
p, li {
font-size: 16px;
line-height: 2;
letter-spacing: 1px;
}
html {
background-color: #7B68EE;
}
body {
width: 600px;
margin: 0 auto;
background-color: #7FFFD4;
padding: 0 20px 20px 20px;
border: 5px solid black;
}
h1 {
margin: 0;
padding: 20px 0;
color: #00539F;
text-shadow: 3px 3px 1px black;
}
h2 {
font-size: 25px;
color: #2E8B57;
}
li{
border-radius: 20px;
padding: 5px 3px;
text-decoration: none;
color: #fff;
background-color: #B0C4DE;
margin: 5px;
}
img {
display: block;
margin: 0 auto;
}
</style>
<title>NOMBRE DE TU PROYECTO</title>
</head>
<body>
<h1><a name="inicio">NOMBRE DE TU PROYECTO DE INVESTIGACIÓN</a></h1>
<h2>Menú</h2>
<ul>
<li><a href="#introduccion">INTRODUCCI&Oacute;N</a></li>
<li><a href="#causas">CAUSAS</a></li>
<li><a href="#consecuencias">CONSECUENCIAS</a></li>
<li><a href="#propuesta">PROPUESTA DE SOLUCI&Oacute;N</a></li>
</ul>
<br>
<h2><a name="introduccion">ESCRIBE AQUÍ LA PROBLEMÁTICA QUE ELEGISTE</a></h2>
<p>ESCRIBE AQUÍ UN PÁRRAFO INTRODUCTORIO DE TU INVESTIGACIÓN</p>
<p>ESCRIBE AQUÍ OTRO PÁRRAFO DE TU INVESTIGACIÓN</p>
<img src="NOMBRE DE TU IMAGEN.jpg" height=200px width=600px align="center">
<br>
<p><a href=#inicio>Regresar al inicio</a></p>
<hr>
<br><br><br><br><br><br><br><br><br><br>
<h2><a name="causas">CAUSAS</a></h2>
<p>ESCRIBE AQUÍ UN PÁRRAFO DE LAS CAUSAS</p>
<table border=1>
<tr>
<th>CAUSA</th>
<th>DESCRIPCI&Oacute;N</th>
</tr>
<tr>
<td>ESCRIBE LA CAUSA 1 </td>
<td> DESCRIBE DE QUE TRATA LA CAUSA</td>
</tr>
<tr>
<td>ESCRIBE LA CAUSA 2 </td>
<td> DESCRIBE DE QUE TRATA LA CAUSA</td>
</tr>
<tr>
<td>ESCRIBE LA CAUSA 3 </td>
<td> DESCRIBE DE QUE TRATA LA CAUSA</td>
</tr>
</table>
<br>
<img src="NOMBRE DE TU IMAGEN.jpg" height=200px width=600px align="center">
<br>
<p><a href=#inicio>Regresar al inicio</a></p>
<hr>
<br><br><br><br><br><br><br><br><br><br>
<h2><a name="CONSECUENCIAS">CONSECUENCIAS</a></h2>
<p>ESCRIBE AQUÍ UN PÁRRAFO DE CONSECUENCIAS</p>
<p>ESCRIBE AQUÍ OTRO PÁRRAFO DE TU INVESTIGACIÓN</p>
<iframe width="560" height="315" src="VIDEO DE YOUTUBE DE LAS CONSECUENCIAS"></iframe>
<br>
<p><a href=#inicio>Regresar al inicio</a></p>
<hr>
<br><br><br><br><br><br><br><br><br><br>
<h2><a name="propuesta">PROPUESTA DE SOLUCIÓN</a></h2>
<p>ESCRIBE AQUÍ TU PROPUESTA DE SOLUCIÓN A LA PROBLEMÁTICA</p>
<p>ESCRIBE AQUÍ OTRO PÁRRAFO DE TU INVESTIGACIÓN</p>
<p>MENSAJE PERSONAL</p>
<img src="NOMBRE DE TU IMAGEN.jpg" height=200px width=600px align="center">
<br>
<p><a href=#inicio>Regresar al inicio</a></p>
<hr>
<br><br><br><br><br><br><br><br><br><br>
</body>
</html>
apellidos_nombre_grupo.zip
File Size: 1 kb
File Type: zip
Descargar archivo

complementa tus páginas web

5/24/2023

 
Inserta hipervínculos en la página "nombre.html" para crear un menú en tu página principal.
<ul>
<li><a href="familia.html">Mi familia</a></li>
<li><a href="pasatiempos.html">Mis pasatiempos</a></li>
<li><a href="lugar.html">Mi lugar de nacimiento</a></li>
</ul>
Inserta imágenes en tu página web descárgalas y guárdalas en tu carpeta, después usa el código y el nombre de tu imagen para que aparezca en tu página.

​<img src="lamurallachina.jpg" height=200px width=400px>

css - hojas de estilos en cascada

Utilizaremos una hoja de estilos en cascada para darle estilo a todo el sitio al mismo tiempo, para ello necesitamos insertar el siguiente código en el head de todas nuestras páginas.
 
​<link href="style.css" rel="stylesheet" type="text/css">

​También tenemos que poner este archivo que es la hoja de estilo en nuestra carpeta.
style.css
File Size: 0 kb
File Type: css
Descargar archivo
Colores hexadecimales para usar en html
Colores

LUGAR.HTML

5/24/2023

 

QUINTA PÁGINA WEB

Realiza la quinta página web de tu sitio, guárdala como "lugar.html"
​<html> 
   <head> 
        <title>El lugar donde nací</title>
   </head> 
   <body>
        <h1>Acerca de mí</h1> 
 
        <h2>El lugar donde nací</h2>

            <p>Yo nací en... </p>
            <br>
            <img src="distritofederal.jpg" height=200px width=400px>

         <h2>El lugar donde vivo</h2>
            <p>Yo vivo en la alcaldía...</p>
            <br>
            <img src="Miguelhidalgo.jpg" height=200px width=400px>

         <h2>A donde quiero ir</h2>
            <p>Yo quiero visitar algun día... </p>
            <br>
            <img src="lamurallachina.jpg" height=200px width=400px>

         <p><a href="nombre.html">Regresar al inicio</a></p>
   </body> 
</html> 

PASATIEMPOS.HTML

5/24/2023

 

cUARTA PÁGINA WEB

Crea tu cuarta página web, complétala con tus pasatiempos o intereses en forma de lista e inserta un video musical que te guste, guárdala en tu carpeta como "pasatiempos.html"
<html> 
   <head> 
        <title>Mis pasatiempos</title>
   </head> 
   <body>
        <h1>Acerca de mí</h1> 
 
        <h2>Mis pasatiempos son:</h1>

        <ul>
           <li>    </li>
           <li>    </li>
           <li>    </li>
        </ul>
<br>

<h2>Uno de mis videos favoritos: </h2>

<iframe width="560" height="315" src="https://www.youtube.com/embed/HgzGwKwLmgM"></iframe>

<p><a href="nombre.html">Regresar al inicio</a></p>
 </body> 
</html> 

familia.HTML

5/24/2023

 

tercer página web

Copia el código en un bloc de notas cambia los nombres y descripciones por los miembros de tu familia y guárdalo en tu carpeta como "familia.html"
<html> 
      <head> 
              <title>Mi familia</title>
      </head> 

   <body>
          <h2>Mi familia</h2>
          <br>
          <table border=1> <!---Esta es una tabla--->
                  <tr><!---Marca la filas---->
                        <th>Nombre del familiar    </th>
                        <th>Parentesco</th>
                        <th>Imagen </th>
                        <th>Descripción </th>
                  </tr>

                  <tr>
                        <td>nombre 1   </td>
                        <td> parentesco 1</td>
                        <td><img src="canela.jpg" height=200px width=150px> </td>
                        <td>¿Qué es para ti? o descripción </td>
                  </tr>

                  <tr>
                         <td>nombre 2     </td>
                         <td>     </td>
                         <td><img src="sailor.jpg" height=200px width=150px></td>
                         <td>     </td>
                  </tr>

                   <tr>
                         <td>nombre 3    </td>
                         <td>    </td>
                         <td><img src="mich.jpg" height=200px width=150px></td>
                         <td>    </td>
                   </tr>
           </table>
​
           <p><a href="nombre.html">Regresar al inicio </a></p>

   </body> 
</html> 

NOMBRE.HTML

5/23/2023

 

segunda página web

  1. Crea una nueva carpeta en tu computadora, se llamará "nombre mi sitio web". (En esta carpeta guardaras tus siguientes páginas e imágenes que utilizarás).
  2. Crea en un nuevo bloc de notas tu segunda página web, se llamará "nombre.html".  (Guarda en la carpeta que creaste)
  3. Copia el código siguiente en el bloc de notas, guárdalo y pruébalo en tu navegador web.
<html> 
       <head> 
                   <title>Mi segunda página web</title>
       </head> 

 <body bgcolor="aqua">
    <h1 align="center">Mi nombre es</h1>

   <h2>Sobre mí</h2> 
    <ul>
       <li>Mi familia</li>
       <li>Mis pasatiempos</li>
       <li>Mi lugar de nacimiento</li>
    </ul>

   <br>
   <h2 align="center">Mi nombre completo</h1>

   <p style="color:brown; font-size:23px">Mi primer nombre es ____ el significado es___ </p>

   <p style="color:orange; font-size:20px"> Mi primer apellido es ___ significa ___ </p>

   <p style="color:black; font-size:20px"> Mi segundo apellido es ___ significa ___ </p>

   <p style="color:teal; font-size:23px; text-align:right"> Mi cumpleaños es el _____ </p>

 </body> 
</html> 
Foto

mI PRIMER PÁGINA WEB

5/23/2023

 
<html>
<head>
  <title>Mi Primera Página</title>
</head>
<body bgcolor="blue">
   <h1>Hola mundo</h1>
  Mi primera página en HTML.
 </body>
</html>
​1.Copia el código en un bloc de notas.
2.Guarda tu archivo con tu nombre y terminación .html ejemplo: martin.html
3.Abre tu archivo con un navegador web y observa el resultado.

    HTML

    Ejercicios de introducción a html, crea un sitio web personal

    Archivos

    Mayo 2023

    Categorías

    All
    Complementos
    Cuarta Página
    Primer Página
    Quinta Página
    Segunda Página
    Tercer Página

Con tecnología de Crea tu propio sitio web con las plantillas personalizables.