Inicio » Cursos » VUE.JS CRUD en PHP y MYSQL

Presentación del Curso

Base de Datos & Api Rest

SinglePage VueJS

Curso VUE.JS CRUD en PHP y MYSQL

Lección: 8 ➜ Diseño CSS | Mejorando el aspecto visual

Programación de una API REST en PHP para gestionar peticiones CRUD, que se necesita en el proyecto de Vue.js con una conexión a la DB MYSQL en tiempo real

Lección 8: Diseño CSS | Mejorando el aspecto visual

 

En este emocionante episodio de nuestro curso de desarrollo web, aprenderás a aplicar diseño CSS de manera efectiva en tu aplicación VueJS con PHP y MySQL. Desde la personalización de estilos hasta la creación de interfaces atractivas, descubre cómo llevar tus proyectos al siguiente nivel estético y funcional. Este tutorial es esencial para aquellos que buscan no solo funcionalidad, sino también una apariencia visualmente impactante en sus aplicaciones web. 🎨💻

CSS

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;700&display=swap');
*{font-family: 'Roboto', sans-serif;}

body{
    background: crimson;
}
.page{
    max-width: 800px;
    margin: 50px auto;
    padding: 10px;
    background: white;
    border-radius: 5px;
}
table{
    width: 100%;
    border: 1px solid gainsboro;
}
thead tr{
    background: black;
    color: white;
}
th,td{
    padding: 7px;
}
tr:nth-child(even){
    background: whitesmoke;
}
button{
    background: crimson;
    color: white;
    border: none;
    padding: 5px 20px;
    border-radius: 5px;
    margin: 5px;
}
button:hover{
    background: red;
}
input[type=text],input[type=email]{
    padding: 7px;
    margin: 5px;
}


.contenedor{
    position: fixed;
    background: rgba(0, 0, 0, 0.558);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.modal{
    background: white;
    border-radius:10px ;
    padding: 15px;
    margin: 100px auto;
    width: 500px;
    height: 300px;
    display: flex;
    flex-direction: column;    
}
.buttons{
    display: flex;
    justify-content: space-between;
}
.text-center{
    text-align: center;
    color: green;
}

3379 visitas

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Descargar ahora

Más cursos que pueden interesarte

Más cursos

Codea Codea App

México, Colombia, España, Venezuela, Argentina, Bolivia, Perú

© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023