Buenos días, Hoy aprenderas la sintaxis de CSS, comprenderas que CSS es muy facil y siempre repetiremos lo mismo en todo el manual, lo único que un poco más amplio.

Selectores CSS

Un selector CSS es un elemento HTML que comparten la definición de la misma propiedad CSS y podemos de clararlo de forma extendida.

por ejemplo, la etiqueda “<body>” se puede definir en CSS de la siguiente manera:

body{
background: #FFF;
color: #000;
font-size: 16px;
}

el anterior codigo CSS quiere decir que cuando en una página añadamos las etiquetas “<body></body>” se definan las características que hemos creado con las propiedades CSS(estas propiedades las veras en la 2ª parte de esta unidad). Realmente lo que hemos hecho es decir que todos los elemento que pongamos en las etiquetas “<body></body>” tengan un fondo blanco(background: #FFF;), el color de texto negro(color: #000;) y el tamaño de texto de 16px(font-size: 16px;).

Tambien podemos definir más elementos HTML como “<h1>,<h2>,<h3>,<h4>,<h5>,<h6>”, “<p>”,”a”,etc.

vamos a ver otro ejemplo, pero esta vez cambiaremos body por h1, aunque podemos añadir las 2 o todas las que quieras en un archivo CSS.

h1{
color: #325012;
font-size: 24px;
font-style: oblique;
}

Si lo has probado y te salio bien, tendras un encabezado verde, de 24px y oblicuo.

Para finalizar esta 1ª parte de la unidad, hay que decir que tambien podemos definir nuestras propias etiquetas HTML, no solo hay etiquetas predeterminadad, también se pueden crear. Para ello, vamos a poner otro ejemplo que debes realizar.

cuadro{
background: #FFF;
border: 1px solid #999;
font-size: 16px;
color: #000;
margin: 5px;
padding: 5px;
}

El resultado final habra sido un cuadro con un fondo blanco, un borde gris, si añades un texto sera de 16 px de color negro, con un margen de 5 px y un relleno de 5 px también.

Esto ha sido todo por hoy, esta semana seguire añadiendo mas clases para que acabemos ya con lo aburrido y pasemos al primer proyecto que sera la creacion de un web estática.

fuente: manualdecss.com
próxima clase: propiedades CSS