Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

[Proyecto] Proyecto haz lo que hicimos en clase

header {
    background-color: #BBBBBB;
    padding: 20px 0;
}

.caja{
    width: 940px;
    position: relative;
    margin: 0 auto;
}

nav{
    position: absolute;
    top:110px;
    right: 0;
}

nav li{
    display: inline;
    margin: 0 0 0 15px;
}

nav a{
    text-transform: uppercase;
    color: #000000;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}

nav a:hover{
    color: #c78c19;
    text-decoration: underline;
}

.productos{
    width: 940px;
    margin: 0 auto;
    padding: 50px;
}


.productos li{
    display: inline-block;
    text-align: center;
    width: 30%;
    vertical-align: top;
    margin: 0 1.5%;
    padding: 30px 20px;
    box-sizing: border-box;
    border: 2px solid #000000;
    border-radius: 10px;
}

.productos li:hover{
    border-color:#c78c19;
}

.productos li:active{
    border-color:#088c19;
}

.productos h2{
    font-size: 30px;
    font-weight: bold;
}

.productos li:hover h2{
    font-size: 33px;
}

.producto-descripcion{
    font-size: 18px;
}

.producto-precio{
    font-size: 20px;
    font-weight: bold;
    margin-top:10px;
}

footer{
    text-align: center;
    background: url(imagenes/bg.jpg);
    padding:40px;
}

.copyright{
    color:#FFFFFF;
    font-size: 13px;
    margin:20px;
}

main{
    width: 940px;
    margin: 0 auto;    
}

form{
    margin: 40px 0;
}

form label, form legend{
    display: block;
    font-size: 20px;
    margin: 0 0 10px;
}

.input-padron{
    display: block;
    margin: 0 0 20px;
    padding: 10px 25px;
    width: 50%;
}

.checkbox{
    margin:20px 0;
}

.enviar{
    width: 40%;
    padding: 15px 0;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    background: orange;
    border: none;     /*sin bordes*/
    border-radius: 5px;  /*esquinas redondas*/
    transition: 1s all ;    /*transicion por tiempo*/
    cursor: pointer; /*click de manito*/
}

.enviar:hover{
    background: darkorange;
    transform: scale(1.2); /*cambia el tamaño cuando pasa el mouse*/

}
1 respuesta

¡Hola! Espero que estés muy bien.

¡Muchas gracias por tu aporte! Es genial ver los puntos de vista y maneras de hacer los ejercicios de nuestros estudiantes, ya que esto enriquece mucho nuestros conocimientos.

¡Si tienes alguna pregunta sobre el contenido de los cursos, no dudes en preguntarnos! Por favor, recuerda utilizar las etiquetas para indicarnos si tu consulta es una duda, sugerencia o cualquier otro tema. De esta manera, podremos filtrar y procesar las dudas y consultas de manera más eficiente, mejorando aún más nuestro desempeño y tiempo de respuesta.

Además, te recomiendo que te unas a nuestra comunidad en Discord. ¡Allí podrás interactuar con otros compañeros, compartir tus ideas y aprender aún más! La interacción es instantánea y te permitirá llegar a muchas más personas. Así que si tienes algún comentario, opinión, recomendación o simplemente quieres compartir tus pensamientos y como hiciste tus ejercicios con la comunidad, ¡no dudes en hacerlo por Discord!

Estamos seguros de que tu aporte será muy valioso para todos nosotros. ¡Un saludo! :)

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios!