Skip to content

Instantly share code, notes, and snippets.

@furenku
Last active December 14, 2021 17:36
Show Gist options
  • Select an option

  • Save furenku/6f1943846e60e4fa79b4d68391261a01 to your computer and use it in GitHub Desktop.

Select an option

Save furenku/6f1943846e60e4fa79b4d68391261a01 to your computer and use it in GitHub Desktop.
estilos generales
<header>
<img src="http://fakeimg.pl/300x100/000/fff?text=Procesar" alt="Logotipo">
</header>
<h1>
Control de acceso
</h1>
<form action="">
<input type="number" name="edad" min="0" max="999">
<button>
Revisar edad
</button>
</form>
<div class="resultado">
Resultado
</div>
html, body {
background-color: darkgray;
}
input, button, .resultado {
margin: 16px;
width: 320px;
padding: 8px;
font-size: 24px;
background-color: black;
color: white;
border: none;
}
button:hover {
background-color: #333333;
}
html, body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
form {
display: flex;
flex-direction: column;
align-items: center;
}
.resultado {
padding: 32px;
font-size: 40px;
text-align: center;
}
button {
box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
}
input {
text-align: center;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment