Creator125 / Inicios-CSS

Inicios CSS

Estas son practicas autodidactas en el lenguaje de estilo CSS, cuyo propósito es el conociento en esta, para aplicar estilos a las paginas y aplicaciones web desde el lado del Frontend.

Documentacion o sitios:

• W3schools: https://www.w3schools.com/css/default.asp

• Mclibre: https://www.mclibre.org/consultar/htmlcss/

• Lengaje css por Manz: https://lenguajecss.com/

Enlaces adicionales:

Unidades de medida

• https://dev.to/lupitacode/unidades-de-medida-en-css-fundamentos-4n0g#:~:text=Estos%20valores%20%28data%20types%29%20pueden%20ser%20de%20diferentes,reciben%20valores%20de%20longitud%20%28px%2C%20em%2C%20rem%2C%20etc..%29.

• https://developer.mozilla.org/es/docs/Learn/CSS/Building_blocks/Values_and_units

• https://www.javatpoint.com/css-units

• https://developer.mozilla.org/es/docs/Web/CSS/length

Contadores

• La propiedad counter-set.

  • https://developer.mozilla.org/en-US/docs/Web/CSS/counter-set

  • https://runebook.dev/es/docs/css/counter-set

• La regla @counter-style

  • https://developer.mozilla.org/es/docs/Web/CSS/@counter-style

  • https://runebook.dev/es/docs/css/@counter-style

  • https://escss.blogspot.com/2013/07/regla-css3-counter-style.html?m=1

Gerarquia de especifidad

• https://i.imgur.com/LSZWYqw.png

Valores para las pseudo-clases cuyo valor sea numerico o :nth-child()**

• https://filisantillan.com/bits/nth-child/

• https://front.id/es/articles/uso-practico-del-selector-nth-child

Gradientes

• https://www.eniun.com/gradientes-css-lineal-radial/

• http://w3.unpocodetodo.info/css3/gradientes-lineales.php

• https://runebook.dev/es/docs/css/css_images/using_css_gradients

• https://developer.mozilla.org/es/docs/Web/CSS/CSS_Images/Using_CSS_gradients

• Gradietes cónicos

  • https://barcelonageeks.com/css-funcion-conic-gradient/

  • https://runebook.dev/es/docs/css/gradient/conic-gradient()

La regla @font-face

• https://runebook.dev/es/docs/css/@font-face

• https://desarrolladoresweb.org/css3/la-regla-font-face/

• http://w3.unpocodetodo.info/css3/font-face.php

Las funciones matriz() y matriz3d()

• https://runebook.dev/es/docs/css/transform-function/matrix()

• https://www-quackit-com.translate.goog/css/functions/css_matrix3d_function.cfm?_x_tr_sl=auto&_x_tr_tl=es&_x_tr_hl=es-419

• https://runebook.dev/es/docs/css/transform-function/matrix3d()

La regla @keyframes

• https://runebook.dev/es/docs/css/@keyframes

Animaciones

• https://developer.mozilla.org/es/docs/Web/CSS/CSS_Animations/Using_CSS_animations

las funciones de Timing-Function trasition y animation

• cubic-bezier()

  • https://www.smashingmagazine.com/2014/04/understanding-css-timing-functions/

  • https://cubic-bezier.com/

• steps()

  • https://www.desarrollolibre.net/blog/css/el-uso-de-la-funcion-step-en-las-animaciones-y-transiciones-en-css

Filtros

• https://developer.mozilla.org/es/docs/Web/CSS/filter

• https://developer.mozilla.org/es/docs/Web/CSS/backdrop-filter

La propiedad box-reflect

• https://developer.mozilla.org/es/docs/Web/CSS/-webkit-box-reflect

Imagenes y objetos

• La propiedad object-fill

  • https://escss.blogspot.com/2013/12/propiedad-css-object-fit.html?m=1

• La propiedad object-position

  • https://www.bisign.es/css/object-position/

• La propiedad image-rendering

  • https://www.w3docs.com/learn-css/image-rendering.html

Variables

• https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties

• http://w3.unpocodetodo.info/css3/variables-css.php

Cursos o videos

• Temporada 1: https://www.youtube.com/watch?v=wZniZEbPAzk

• Temporada 2: https://www.youtube.com/playlist?list=PLvRPaExkZHFkQoOMPTU4pFSz6ednD_vGE