generated from jesusgpa/2023-2024-CSAAI-Practicas
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
bb79a69
commit e3fd12b
Showing
8 changed files
with
267 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,145 @@ | ||
| /* https://www.w3schools.com/howto/howto_css_two_columns.asp */ | ||
| /* https://developer.mozilla.org/es/docs/Web/CSS/box-sizing */ | ||
| /* Así definimos el comportamiento de caja para todos los elementos */ | ||
| body { | ||
| background: no-repeat; | ||
| background-image: url(FondoFinal.jpg); | ||
| background-size: auto; | ||
| } | ||
| * { | ||
| box-sizing: border-box; | ||
| } | ||
|
|
||
| @font-face { | ||
| font-family: "PokemonBlanco"; | ||
| src: url("LetraPokemon.ttf"); | ||
| } | ||
|
|
||
| /* Crear columnas de ancho diferente que se colocan una a continuación de la otra */ | ||
| .columna { | ||
| float: left; | ||
| padding: 10px; | ||
| min-height: 500px; | ||
| } | ||
|
|
||
| .superior { | ||
| width: 100%; | ||
| } | ||
| .izquierda { | ||
| width: 50%; | ||
| } | ||
|
|
||
| .derecha { | ||
| width: 50%; | ||
| } | ||
|
|
||
|
|
||
| /* Cabeceras */ | ||
| h1 { | ||
| font-family:"PokemonBlanco"; | ||
| font-size: 50px; | ||
| text-align: center; | ||
| text-shadow:4px 4px #ffcb51; | ||
| /* border-bottom: none; */ | ||
| padding: 10px; | ||
| margin: 50px; | ||
| margin-bottom: 0px; | ||
| } | ||
|
|
||
| .titulo{ | ||
| font-family:"PokemonBlanco"; | ||
| font-size: 20px; | ||
| text-align: center; | ||
| text-shadow:4px 4px #ffcb51; | ||
| border-bottom: #ffcb51 10px double; | ||
| /* border-bottom: none; */ | ||
| padding: 0px; | ||
| margin: 50px; | ||
| margin-bottom: 0px; | ||
|
|
||
| } | ||
| .referencias{ | ||
| font-family:"PokemonBlanco"; | ||
| font-size: 20px; | ||
| text-align: center; | ||
| text-shadow:4px 4px #ffcb51; | ||
| padding: 0px; | ||
| margin: 50px; | ||
| margin-bottom: 0px; | ||
| width: 90% | ||
|
|
||
| } | ||
| .parrafos{ | ||
| font-family:"PokemonBlanco"; | ||
| font-size: 10px; | ||
| color: rgb(255, 255, 255); | ||
| text-align: left; | ||
| /* border-bottom: #ffcb51 10px double; */ | ||
| /* border-bottom: none; */ | ||
| padding: 0px; | ||
| margin: 10px; | ||
| margin-bottom: 0px; | ||
|
|
||
| } | ||
| .video{ | ||
| text-align: center; | ||
| } | ||
| /* Clear floats despues de las columnas para eliminar la superposición */ | ||
| .fila:after { | ||
| content: ""; | ||
| display: table; | ||
| clear: both; | ||
| } | ||
|
|
||
| #c1 { | ||
| background-color: rgba(0, 0, 0, 0.7); | ||
| border: #ffcb51 10px double; | ||
| padding: 10px; | ||
| } | ||
|
|
||
| #c2 { | ||
| background-color: rgba(0, 0, 0, 0.7); | ||
| border: #ffcb51 10px double; | ||
| padding: 10px; | ||
| } | ||
|
|
||
| /* estilos para imágenes https://www.w3schools.com/css/css3_images.asp */ | ||
| /* posicionamiento de imágenes https://www.w3schools.com/css/css_positioning.asp */ | ||
|
|
||
|
|
||
| img { | ||
| width: 100%; | ||
| height: auto; | ||
| margin-bottom: 0px | ||
| } | ||
|
|
||
| .imagen { | ||
| float: left; | ||
| width: 100%; | ||
| border: #ffcb51 10px double; | ||
| margin: 0px; | ||
| padding: 20px; | ||
| } | ||
|
|
||
|
|
||
| /* Estilo del gif */ | ||
| .gif{ | ||
| position: absolute; | ||
| left:260px; | ||
| } | ||
|
|
||
|
|
||
| /* Responsive layout - cuando el ancho de pantalla es menor a 600px, muestra las columnas apiladas. */ | ||
| /* Así conseguimos que el contenido se vea bien en dispositvos móviles */ | ||
|
|
||
| @media screen and (max-width: 600px) { | ||
| .columna { | ||
| width: 100%; | ||
| } | ||
|
|
||
| .iresponsive { | ||
| width: 100%; | ||
| } | ||
| } | ||
|
|
||
| /* Más sobre diseño web responsive https://www.w3schools.com/css/css_rwd_intro.asp */ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,120 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <link rel="shortcut icon" href="pokeball.gif" sizes="64x64"> | ||
| <title>N</title> | ||
|
|
||
| <!-- Hoja de estilo --> | ||
| <link rel="stylesheet" href="about.css"> | ||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <h1>Natural Harmonia Gropius</h1> | ||
| <div class="fila"> | ||
| <div id="c1" class="columna superior"> | ||
| <div class="titulo"> | ||
| <h2>Presentacion</h2> | ||
| </div> | ||
| <div class ="parrafos"> | ||
| <p> | ||
| Buenas, soy Natural Harmonia Gropius, tambien conocido como N. Mi conexión con los Pokemon es profunda, y mi objetivo es comprender y respetar la verdadera naturaleza de estos increibles seres. | ||
| <br> | ||
| <br> | ||
| Mi proposito en la vida siempre a sido liberar a los Pokémon de las restricciones humanas y permitirles vivir en armonia con la naturaleza. | ||
| <br> | ||
| Enfrente desafíos y descubri la complejidad de la relacion entre humanos y Pokemon. | ||
| <br> | ||
| <br> | ||
| La mayoria de la gente desgraciadamente me recuerda por una mala epoca, cuando fui lider del Equipo Plasma, donde crei que todos compartian mis ideales. Hace tiempo que me separe de ellos, ya que en el interior de mi antigua organizacion se ocultaban acciones despreciables. | ||
| <br> | ||
| <br> | ||
| Creo en la comunicacion genuina con los Pokémon. Mi capacidad de entender su lenguaje me ha permitido construir lazos fuertes y comprender sus deseos y necesidades. La verdadera fuerza radica en la conexion entre entrenador y Pokemon. | ||
| <br> | ||
| <br> | ||
| A lo largo de mi viaje, he enfrentado desafios que me han llevado a cuestionar las acciones humanas. | ||
| <br> | ||
| Busco la verdad y la coexistencia pacifica, y siempre estoy dispuesto a desafiar las normas establecidas para lograr ese objetivo. | ||
| <br> | ||
| <br> | ||
| Les animo a reflexionar sobre la relación que tienen con sus Pokemon. | ||
| <br> | ||
| ¿Como pueden mejorarla? ¿Como pueden contribuir a un mundo donde la coexistencia y el respeto son la norma? | ||
| <br> | ||
| <br> | ||
| ¡Que la armonia guie vuestro viaje, entrenadores! | ||
| </p> | ||
|
|
||
| </div> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| <div class="fila"> | ||
| <div id="c1" class="columna izquierda"> | ||
|
|
||
|
|
||
| <div class="titulo"> | ||
| <h2>Personalidad</h2> | ||
| </div> | ||
|
|
||
| <div class ="parrafos"> | ||
| <p> | ||
| Me considero un chico serio y pacifico, al que le gusta hablar sobre sus ideales y suele hacerlo de manera apresurada. | ||
| <br> | ||
| Algunos me consideran alguien un tanto enigmatico, con ideologias radicales acerca de la relacion entre entrenadores y Pokemon, pero yo pienso que me diferencia el ser capaz de comprender a los Pokemon con tan solo mirarlos. | ||
| <br> | ||
| Me gustaria que los Pokemon fuesen libres y no fuesen utilizados por los entrenadores para su ridiculo entretenimiento. | ||
| </p> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| <div id="c2" class="columna derecha"> | ||
|
|
||
|
|
||
| <div class="titulo"> | ||
| <h2>Mi historia</h2> | ||
| </div> | ||
| <div class="parrafos"> | ||
| <p> | ||
| Soy el hijo adoptivo de Ghechis, fui criado por Pokémon salvajes en mi niñez. | ||
| <br> | ||
| A medida que creci, fui nombrado como el rey y lider del Equipo Plasma, al crecer lo hice aislado de la sociedad y en mi palacio, con Pokemon que, segun mi padre, habian sido maltratados por los humanos. Algunos me consideran una especie de antagonista, pero en mi opinion tengo un buen corazon y a diferencia de otros veo a los Pokemon como amigos. Debido a esto creci pensando que los Pokemon debian ser liberados. | ||
| <br> | ||
| <br> | ||
| Habia conseguido avanzar en mis planes de liberar a los Pokemon junto a mi nuevo compañero Reshiram, pero el nuevo campeon de la liga junto a Zekrom me detuvo. | ||
| <br> | ||
| Después de aceptar mi amarga derrota, mi padre revelo susverdaderos planes, aislar a los Pokemon y ser el unico que pueda tenerlos y asi dominar Teselia. | ||
| <br>A pesar de todo, el tambien fue derrotado y atrapado, yo simplemente me fui a explorar el mundo a lomos de Reshiram pensando en que la persona que consideraba mi padre solo me manipulo para sus ideales. | ||
|
|
||
|
|
||
| </p> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
| <div class="fila"> | ||
| <div id="c1" class="columna superior"> | ||
| <div class="titulo" style="font-size: 50px;"> | ||
| <a href="https://yamoreno2021.github.io/2023-2024-CSAAI-Practicas/p1/">Pagina Principal</a> | ||
| </div> | ||
|
|
||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
| </div> | ||
|
|
||
| </div> | ||
| </div> | ||
|
|
||
| </body> | ||
| </html> |
Binary file not shown.
Binary file not shown.
Binary file not shown.