generated from marquez.juan/Ejercicio-inicial--git-y-HTML
Agrega CSS y gitignore
This commit is contained in:
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
.DS_Store
|
||||||
46
Ascani.html
46
Ascani.html
@@ -4,6 +4,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Document</title>
|
<title>Document</title>
|
||||||
|
<link rel="stylesheet" href="ascani.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
@@ -11,29 +12,35 @@
|
|||||||
<h2>Materia: Programación 1</h2>
|
<h2>Materia: Programación 1</h2>
|
||||||
<h3>Alumna: Ascani Andrea</h3>
|
<h3>Alumna: Ascani Andrea</h3>
|
||||||
</header>
|
</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>
|
<nav>Registrá tus citas favoritas</nav>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li>Tenelas siempre a mano</li>
|
<li>Tenelas siempre a mano</li>
|
||||||
<li>Llevalas digitalmente con vos</li>
|
<li>Llevalas digitalmente con vos</li>
|
||||||
<li>Buscalas de diversas maneras</li>
|
<li>Buscalas de diversas maneras</li>
|
||||||
</ul>
|
</ul>
|
||||||
</body>
|
|
||||||
<form action="mailto:35447754@terciariourquiza.edu.ar" method="post" enctype="text/plain">
|
<form action="mailto:35447754@terciariourquiza.edu.ar" method="post" enctype="text/plain">
|
||||||
<p>Ingresa los datos principales de la cita</p>
|
<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="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>
|
<p>Ingresa qué tipo de cita deseas guardar</p>
|
||||||
<input type="radio" id="hobbie" name="tipocita" value="h">
|
<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">
|
<input type="radio" id="profesional" name="tipocita" value="p">
|
||||||
<label for="profesional">Profesional/Laboral</label> <br> <br>
|
<label for="profesional">Profesional/Laboral</label>
|
||||||
<label for="correo">Ingresá tu correo electrónico:</label>
|
|
||||||
<input type="email" id="correo" name="correo" required> <br>
|
<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">
|
<label for="nacionalidad">Nacionalidad del autor/a</label>
|
||||||
<p>Si la conoces, ingresa la nacionalidad de la/el autor/a</p>
|
<select name="nacionalidad" id="nacionalidad" required>
|
||||||
<select name="nacionalidad" id="opciones">
|
|
||||||
<option value="">--Seleccione--</option>
|
<option value="">--Seleccione--</option>
|
||||||
<option value="af">Afgana</option>
|
<option value="af">Afgana</option>
|
||||||
<option value="al">Albanesa</option>
|
<option value="al">Albanesa</option>
|
||||||
@@ -234,13 +241,16 @@
|
|||||||
<option value="dj">Yibutiana</option>
|
<option value="dj">Yibutiana</option>
|
||||||
<option value="zm">Zambiana</option>
|
<option value="zm">Zambiana</option>
|
||||||
<option value="zw">Zimbabuense</option>
|
<option value="zw">Zimbabuense</option>
|
||||||
</select> <br> <br>
|
</select>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
<label for="favorita">Haz click para marcar esta cita como favorita</label>
|
<label for="favorita">Haz click para marcar esta cita como favorita</label>
|
||||||
<input type="checkbox" id="favorita" name="favorita" value="favorita"> <br> <br>
|
<input type="checkbox" id="favorita" name="favorita">
|
||||||
<textarea id="comentarios" name="comentarios" rows="7" cols="200">
|
|
||||||
Escribe aquí tu cita...
|
<br><br>
|
||||||
</textarea>
|
|
||||||
<button type="submit">Enviar</button>
|
<button type="submit">Guardar Cita</button>
|
||||||
</form>
|
</form>
|
||||||
<footer> Contacto alumna: 35447754@terciariourquiza.edu.ar</footer>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
111
ascani.css
Normal file
111
ascani.css
Normal 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 */
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user