Las Hojas de Estilo en Cascada o CSS (del inglés Cascading Style Sheets) es el lenguaje de estilos utilizado para describir la presentación de documentos HTML o XML (incluyendo varios languages basados en XML como SVG, MathML o XHTML).
CSS describe como debe ser renderizado el elemento estructurado en la pantalla, en papel, en el habla o en otros medios.
CSS es uno de los lenguajes base de la Open Web y posee una especificación estandarizada por parte del W3C. Anteriormente , el desarrollo de varias partes de las especificaciones de CSS era realizado de manera sincrónica, lo que permitía el versionado de las recomendaciones.
Probablemente habrás escuchado acerca de CSS1, CSS2.1, CSS3. Sin embargo, CSS4 nunca se ha lanzado como una versión oficial.
Es decir que permite el uso de colores y dimensiones como propiedades de las etiquetas que se requieren cambiar, usando HTML como ejemplo podríamos decidir el tamaño de un titulo usando una etiqueta <h1>, definiendo la fuente, color y tamaño al igual que algunas propiedades que pusieran al título ya sea vertical o invertido, claro todo esto es dependiendo de lo que se desea expresar en nuestros sitios.
Paso 1
Proporciona un suave comienzo hacia el dominio de CSS con los conceptos básicos acerca de su funcionamiento, la sintaxis y la manera en que puedes comenzar a utilizarlo para agregar estilos al HTML, por ejemplo, alterando la fuente, color, tamaño y espaciado del contenido, dividirlo en múltiples columnas o agregar animaciones y otras características decorativas.
Paso 2
Analiza la cascada y la herencia, todos los tipos de selectores que tenemos disponibles, unidades, tamaño, estilo de fondos y bordes, depuración (debugging). El propósito de este paso es proporcionarte un set de herramientas para escribir CSS competente y ayudarte a entender todas la teoría esencial antes de avanzar hacia cuestiones más específicas como estilo de textos y diseño CSS.
Paso 3
Aquí veremos los fundamentos del estilo del texto, incluida la configuración de la fuente, negrita, cursiva, espaciado entre líneas y letras, sombras y otras características del texto. Terminaremos el paso 3 analizando la aplicación de fuentes personalizadas a tu página y en el estilo de listas y enlaces.
Paso 4
En este punto ya hemos analizado los fundamentos de CSS, cómo dar estilo al texto y cómo diseñar y manipular las cajas en las que se encuentra el contenido. Ahora es el momento de ver cómo colocar sus cajas en el lugar correcto en relación con la pantalla del dispositivo y entre sí.
Hemos cubierto los requisitos previos necesarios para que ahora puedas profundizar en el diseño de CSS, mirando diferentes configuraciones de pantalla, métodos de diseño tradicionales que implican flotación y posicionamiento, y nuevas herramientas de diseño como flexbox, grid y posicionamiento, así como algunas técnicas de herencia que quizás desees conocer.
paso 5
Proporcionar enlaces a secciones de contenido que explican cómo usar CSS para resolver problemas muy comunes al crear una página web.
Beneficios del CSS
Al comparar un sitio con CSS y otro sin CSS sabrás a simple vista notar las grandes diferencias de esta comparación.
En algún momento de nuestra vida en internet habremos notado algunos sitios que al cargarlos de una u otra manera se ven raros que incluso cuestan leer o entender de que se tratan, esto se debe a los estilos del sitio que por un problema u otro los estilos no se logran relacionar con la pagina.
Cuando algo así sucede nos damos cuenta de lo importante que son los estilo, el CSS nos permitirá hacer un contenido impresionante desde el desplazamiento de formas geométricas hasta hacer efectos en tercera dimensión.
Antes de CSS, todo el estilo debía incluirse en el marcado HTML. Esto significa que había que describir por separado todos los fondos, los colores de fuente, las alineaciones, etc.
CSS permite estilizar todo en un archivo diferente, creando el estilo allí y después integrando el archivo CSS sobre el marcado HTML. Esto hace que el marcado HTML sea mucho más limpio y fácil de mantener.
En Resumen CSS te permite tener múltiples estilos en una página HTML, y esto hace que las posibilidades de personalización sean casi infinitas. Hoy en día, esto se está volviendo una necesidad más que algo básico.
Esperamos que este artículo te haya resultado útil y, si tienes alguna pregunta, escríbela en la sección de comentarios a continuación.