[INSERT_ELEMENTOR id=927]
Concepto de CSS
¿Qué es el CSS?
CSS es un lenguaje de programación que se utiliza para definir el estilo y el aspecto de un documento que se ha escrito a través de un lenguaje de etiquetas, como HTML. Conocido también como hojas de estilo en cascada, es el que se emplea para dar colores, indicar tipos de letra o incluso señalar aspectos como el espacio entre elementos para dotar de estilo a una web.
Es uno de los pilares fundamentales del desarrollo y el diseño web, como también una de las mayores pesadillas de todo programador. Dado que es el conjunto de reglas que se indican a los navegadores para que muestren los elementos de una página, realizar las instrucciones incorrectas puede desembocar en la presentación de una web imposible de visualizar correctamente.
Generalmente, cada una de las reglas CSS que se emplean están compuestas por una serie de propiedades, o properties, que poseen valores con los que se indica la presentación de todo el contenido dictado en HTML; y, por otra parte, selectores con los que se indican qué elementos se verán afectados por dichas propiedades y sus valores.
Todo este conjunto es el que conforma los archivos que se han de indicar a los navegadores para determinar la apariencia de las páginas web. No obstante, lo complicado de su manejo y la necesidad de aprender nociones de programación son algo que suele llevar a muchos a confiar en plantillas predeterminadas u otras soluciones mucho más cómodas que hacen estas tareas infinitamente más sencillas, aunque renunciando a la total personalización.
Para qué sirve el CSS
CSS sirve para poder dar un estilo a cualquier web y hacerlo con las reglas que se deseen. Es el lenguaje con el que el programador y el navegador se comunican para indicar a este último cómo ha de distribuir los contenidos de una web en base a las instrucciones indicadas en los correspondientes ficheros.
A su vez, tiene como principal finalidad conseguir estilos diferentes y a medida de las necesidades de cada página. Aunque, desafortunadamente, exige un amplio conocimiento de programación y grandes nociones de lenguaje HTML también para conseguir la conexión perfecta entre estilo y contenidos.
Ejemplos de CSS
Para dar un ejemplo de CSS, vamos a proceder con unas sencillas líneas de código para web y para la hoja de estilo.
Primero, vamos con la web:
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>CSS Ejemplo de NeoAttack</title>
<link rel=”stylesheet” href=”style.css”>
</head>
<body>
<h1>Agencia de marketing digital</h1>
</body>
</html>
Ahora, seguimos indicando que el texto dentro del título H1 tendrá color rojo y un fondo azul usando CSS:h1
{
background-color: blue;
color: red;
}
Combinando ambos, el primer conjunto llama al archivo style.css para hacer que el H1 luzca como hemos indicado.
Más información sobre el CSS
Para aprender más sobre CSS, te recomendamos que leas los posts que enlazamos a continuación, contienen más información al respecto.