Muestra las diferencias entre dos versiones de la página.
Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
clase:daw:diw:1eval:tema02 [2023/10/03 14:07] admin [Estructura de ficheros] |
clase:daw:diw:1eval:tema02 [2025/03/24 12:54] (actual) admin [Reset CSS] |
||
---|---|---|---|
Línea 5: | Línea 5: | ||
Mas información: | Mas información: | ||
- | * [[https://alligator.io/css/css-grid-layout-grid-areas/ | + | * [[https://css-tricks.com/almanac/properties/ |
+ | * [[https:// | ||
<sxh html> | <sxh html> | ||
Línea 65: | Línea 66: | ||
Incluir en todos los proyectos los siguientes CSS: | Incluir en todos los proyectos los siguientes CSS: | ||
- | * [[http:// | + | * [[https:// |
* [[http:// | * [[http:// | ||
Línea 164: | Línea 165: | ||
* Transformar de SASS a CSS | * Transformar de SASS a CSS | ||
- | sass | + | sass ./main.scss ./main.css |
* Transformas de SASS a CSS simpre que cambie el CSS | * Transformas de SASS a CSS simpre que cambie el CSS | ||
- | sass --watch | + | sass --watch ./main.scss ./main.css |
* Se pueden juntar el SASS de un fichero en otro para así que se genere un único CSS con lo que se carga la página mas rápida. | * Se pueden juntar el SASS de un fichero en otro para así que se genere un único CSS con lo que se carga la página mas rápida. | ||
Línea 386: | Línea 387: | ||
===== Estructura de ficheros ===== | ===== Estructura de ficheros ===== | ||
Siguiente la metodología de BEM , se debe seguir la siguiente estructura de carpetas para almacenar el código SASS | Siguiente la metodología de BEM , se debe seguir la siguiente estructura de carpetas para almacenar el código SASS | ||
+ | /css | ||
+ | | ||
/scss | /scss | ||
/ | / | ||
- | _variables.scss | + | _css-variables.scss |
+ | | ||
| | ||
| | ||
+ | | ||
/02_base | /02_base | ||
_override.scss | _override.scss | ||
Línea 408: | Línea 412: | ||
* / | * / | ||
- | * _variables.scss: Variables como por ejemplo los colores o tamaños de margen ,etc. | + | * _css-variables.scss: Variables |
+ | * _sass-variables.scss: | ||
* _functions.scss: | * _functions.scss: | ||
* _mixins.scss: | * _mixins.scss: | ||
+ | * _animations.scss: | ||
* /02_base | * /02_base | ||
* _override.scss: | * _override.scss: |