ascani.andrea/TP-Diagnostico
1
0
Fork 0
generated from marquez.juan/Ejercicio-inicial--git-y-HTML
Code Issues Pull Requests Projects Releases Wiki Activity

Agrega CSS y gitignore

Browse Source
This commit is contained in:
Andrea Ascani
2026-04-26 21:01:49 -03:00
parent d32ececdf0
commit 7db3f9ac4a
3 changed files with 355 additions and 233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
.DS_Store

46
Ascani.html
View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="ascani.css">
</head>
<body>
<header>
@@ -11,29 +12,35 @@
<h2>Materia: Programación 1</h2>
<h3>Alumna: Ascani Andrea</h3>
</header>
<img src="imagencita.jpeg" style="display: block; margin: 0 auto; width: 20%; height: auto;">
<img src="imagencita.jpeg" alt="Cuaderno con frase" class="imagen-destacada" style="display: block; margin: 0 auto; width: 20%; height: auto;">
<nav>Registrá tus citas favoritas</nav>
<ul>
<li>Tenelas siempre a mano</li>
<li>Llevalas digitalmente con vos</li>
<li>Buscalas de diversas maneras</li>
</ul>
</body>
<form action="mailto:35447754@terciariourquiza.edu.ar" method="post" enctype="text/plain">
<p>Ingresa los datos principales de la cita</p>
<input type="text" id="nombreautor" name="nombreautor" placeholder="Nombre de la/el autor/a">
<input type="text" id="nombrelibro" name="nombrelibro" placeholder="Nombre del libro o publicación"> <br>
<input type="text" id="nombrelibro" name="nombrelibro" placeholder="Nombre del libro o publicación">
<br>
<p>Ingresa qué tipo de cita deseas guardar</p>
<input type="radio" id="hobbie" name="tipocita" value="h">
<label for="hobbie">Hobbie/Placer</label><br>
<label for="hobbie">Hobbie/Placer</label>
<br>
<input type="radio" id="profesional" name="tipocita" value="p">
<label for="profesional">Profesional/Laboral</label> <br> <br>
<label for="correo">Ingresá tu correo electrónico:</label>
<input type="email" id="correo" name="correo" required> <br>
<p>Ingresa cuántas citas estás por ingresar a la vez</p>
<input type="number" id="cantidad" name="cantidad" min="1" max="100" step="1" value="1">
<p>Si la conoces, ingresa la nacionalidad de la/el autor/a</p>
<select name="nacionalidad" id="opciones">
<label for="profesional">Profesional/Laboral</label>
<br>
<label for="nacionalidad">Nacionalidad del autor/a</label>
<select name="nacionalidad" id="nacionalidad" required>
<option value="">--Seleccione--</option>
<option value="af">Afgana</option>
<option value="al">Albanesa</option>
@@ -234,13 +241,16 @@
<option value="dj">Yibutiana</option>
<option value="zm">Zambiana</option>
<option value="zw">Zimbabuense</option>
</select> <br> <br>
</select>
<br><br>
<label for="favorita">Haz click para marcar esta cita como favorita</label>
<input type="checkbox" id="favorita" name="favorita" value="favorita"> <br> <br>
<textarea id="comentarios" name="comentarios" rows="7" cols="200">
Escribe aquí tu cita...
</textarea>
<button type="submit">Enviar</button>
<input type="checkbox" id="favorita" name="favorita">
<br><br>
<button type="submit">Guardar Cita</button>
</form>
<footer> Contacto alumna: 35447754@terciariourquiza.edu.ar</footer>
</body>
</html>

111
ascani.css Normal file
View File

@@ -0,0 +1,111 @@
body {
background-color: #fdfaf3;
color: #4a3728;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
margin: 0;
padding: 20px;
}
header {
text-align: center;
border-bottom: 2px solid #5f9ea0;
margin-bottom: 30px;
padding-bottom: 10px;
}
header h1 {
margin: 0;
color: #5f9ea0;
}
.imagen-destacada {
display: block;
max-width: 400px;
height: auto;
margin: 20px auto;
border: 8px solid #fff;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
border-radius: 4px;
}
form {
max-width: 500px;
margin: 0 auto;
background: #ffffff;
padding: 30px;
border-radius: 12px;
box-shadow: 0 10px 25px rgba(74, 55, 40, 0.05);
}
label {
display: block;
margin-bottom: 8px;
font-weight: bold;
font-size: 0.9em;
}
input, select, textarea {
width: 100%;
padding: 12px;
margin-bottom: 20px;
border: 1.5px solid #e0e0e0;
border-radius: 6px;
box-sizing: border-box;
background-color: #fafafa;
transition: border-color 0.3s;
}
input:focus, select:focus {
outline: none;
border-color: #5f9ea0;
}
button {
background-color: #4a3728;
color: #fdfaf3;
padding: 12px 24px;
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 1em;
width: 100%;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #5f9ea0;
}
input[type="radio"], input[type="checkbox"] {
width: auto;
margin-bottom: 0;
vertical-align: middle;
}
input[type="radio"] + label {
display: inline-block;
width: auto;
margin-left: 10px;
vertical-align: middle;
}
nav {
text-align: center;
font-weight: bold;
margin-top: 20px;
color: #5f9ea0;
}
ul {
list-style-position: inside;
padding: 0;
margin: 10px 0;
}
ul {
text-align: center;
list-style-position: inside; /* Mueve el puntito hacia adentro para que no quede a la izquierda */
padding: 0; /* Elimina el espacio reservado para los puntos */
margin: 20px 0; /* Espacio arriba y abajo de la lista */
}