Publicado el 19 de Marzo del 2018
1.167 visualizaciones desde el 19 de Marzo del 2018
1,1 MB
31 paginas
Creado hace 11a (13/01/2014)
Curso de CSS - CEF NAC
www.ceformativos.com
1
Curso de CSS - CEF NAC
Índice
Prefacio ................................................................................................................................... 3
Introducción a CSS ................................................................................................................. 4
Capítulos de contenidos del Curso ........................................................................................ 6
1. Primeros pasos en CSS ................................................................................................ 6
2. Sintaxis CSS ................................................................................................................. 8
3. Atributos y valores ...................................................................................................... 9
4. Los selectores CSS ..................................................................................................... 10
5. Agrupación de los selectores CSS ............................................................................. 13
6. Clases, pseudoclases y pseudoelementos ................................................................ 13
7. Bordes ....................................................................................................................... 15
8. Fondos....................................................................................................................... 17
9. El texto ...................................................................................................................... 19
10.Márgenes .................................................................................................................. 23
11.Cursores .................................................................................................................... 24
12.Transparencias y CSS ................................................................................................ 26
13.Las reglas AT ............................................................................................................. 27
14.La regla @import ...................................................................................................... 28
15.Tipos de medio ......................................................................................................... 29
Más documentación sobre CSS ........................................................................................... 31
www.ceformativos.com
2
Curso de CSS - CEF NAC
Prefacio
En este curso te expondremos las características y funcionamiento de las Hojas de Estilo
en Cascada (CSS, Cascading Style Sheets).
Para lograr que comprendas correctamente este lenguaje comenzaremos con una
explicación sobre las CSS, haciendo énfasis en su completo funcionamiento e importancia.
Hemos decidido, como es costumbre en nuestros cursos y guías, separar los contenidos
del curso en capítulos. Además este curso posee un glosario de términos para
proporcionarte el significado de palabras o términos, a consideración nuestra, de difícil
entendimiento.
Aclaramos que para poder entender correctamente este curso deben poseer solo
conocimientos muy básicos sobre los lenguajes de programación y en especial el lenguaje
HTML.
Igualmente para este curso no es necesaria la utilización de un software en particular. Si
desea puede utilizar algún editor de texto como el Bloc de notas de Windows, pero en lo
personal recomendamos el editor de texto Notepad++ pues es mucho más cómodo para
todo lo relacionado con lenguajes de programación. También si desea tener un mejor
control y visualización del código y diseño, recomendamos Dreamweaver. Esta aplicación
Adobe está destinada a la construcción, diseño y edición de sitios y aplicaciones Web.
www.ceformativos.com
3
Curso de CSS - CEF NAC
Introducción a CSS
Comenzaremos tu familiarización con este lenguaje por una breve introducción, para
presentar las CSS y posteriormente analizar y comprender su utilización y ventajas.
¿Qué es CSS?
Las CSS son un conjunto de instrucciones que permiten definir la apariencia de un sitio
web, compuesto por diferentes elementos HTML. CSS posee una forma de representación
de los estilos que permite un control total sobre la apariencia y posición de todos los
elementos en una página web.
Algo historia sobre CSS
CSS ha sido creado en varios niveles y perfiles. Cada nivel de CSS se construye sobre el
anterior, generalmente incorporando funciones al nivel previo.
Los perfiles son, generalmente, parte de uno o varios niveles de CSS definidos para un una
determinada interfaz.
CSS1
La primera especificación oficial de CSS fue publicada en diciembre 1996 y fue
abandonada en abril de 2008.
CSS2
La especificación CSS2 fue publicada como recomendación en mayo de 1998, y
abandonada en abril de 2008.
CSS 2.1
www.ceformativos.com
4
Curso de CSS - CEF NAC
CSS 2.1 fue la primera revisión de CSS2, usualmente conocida como “CSS 2.1”. Esta versión
corrige algunos errores encontrados en CSS2, elimina funcionalidades poco soportadas o
inoperables en los navegadores y añade alguna nueva especificación.
De acuerdo al sistema de estandarización técnica de las especificaciones, CSS2.1 tuvo el
estatus de "candidato" durante varios años, pero la propuesta fue rechazada en junio de
2005.
En junio de 2007 fue propuesta una nueva versión candidata, actualizada en 2009, pero en
diciembre de 2010 fue nuevamente rechazada.
En abril de 2011, CSS 2.1 volvió a ser propuesta como candidata, y después de ser
revisada, fue finalmente publicada como recomendación oficial el 7 de junio de 2011.
CSS3
En diferencia a CSS2, que fue una gran especificación que definía varias funcionalidades,
CSS3 está dividida en varios documentos separados, llamados "módulos".
Cada módulo añade nuevas funcionalidades a las definidas en CSS2, de manera que se
preservan las anteriores para mantener la compatibilidad.
Los trabajos en el CSS3, comenzaron a la vez que se publicó la recomendación oficial de
CSS2, y los primeros borradores de CSS3 fueron liberados en junio de 1999.
www.ceformativos.com
5
Curso de CSS - CEF NAC
Capítulos de contenidos del Curso
Continuamos con tu familiarizarnos con las CSS, de manera sencilla para comprender
correctamente las Hojas de Estilo en Cascada.
1. Primeros pasos en CSS
Primeramente mostraremos como aplicar estilos a elementos HTML, lo cual es algo básico
y muy importante para comenzar a familiarizarse con el funcionamiento de las CSS.
Aplicar estilo CSS a un elemento HTML
Para aplicar un estilo CSS directamente a un elemento, utilizamos el parámetro style.
Ejemplo de utilización del parámetro style:
Agrupar estilos entre etiquetas style asignando cada estilo a un elemento.
También podemos agrupar los estilos entre las etiquetas style y asignar cada estilo a un
elemento usando selectores.
Ejemplo de documento HTML con etiquetas style:
www.ceformativos.com
6
Curso de CSS - CEF NAC
style.html
Otra forma para aplicar estilos a una página HTML.
Otra forma para aplicar estilos a páginas HTML es crear un archivo .css donde
guardaremos todos los estilos del documento para luego cargar o llamar a este fichero en
las páginas HTML que se le quiera aplicar un estilo determinado.
Esta manera de incorporar estilos es la recomendada por nosotros pues así tendríamos
todos los estilos, de nuestra página, en un solo archivo asegurando un estilo uniforme
para nuestra aplicación web.
Ejemplo de un archivo CSS:
style.css
A continuación veremos como incluir un archivo CSS (style.css) en una página
HTML.
www.ceformativos.com
7
Curso de CSS - CEF NAC
style.html
2. Sintaxis CSS
La sintaxis de un archivo CSS está compuesta por 3 elementos:
Atributos - Palabras que identifican un estilo (van seguido de dos puntos y el valor
que se le asigna y separados por coma).
Valores - Definen a los atributos.
Selectores - Indican los elementos a los que se les va a aplicar el estilo.
Nota:
Cuando se está trabajando fuera de un objeto, es decir, no se está usando el
parámetro style="", se tiene que indicar sobre que elemento de la página se quiere
aplicar el estilo, esto se realiza a través de selectores.
Los selectores van seguidos de los atributos encerrados en llaves.
Ejemplo de un selector:
www.ceformativos.com
8
Curso de CSS - CEF NAC
En el ejemplo anterior se le está aplicando el estilo a todos los elementos input. Asignando
color negro (#000000) y fondo blanco (#FFFFFF).
Nota:
Los valores aplicados al atributo, dependerán de este. Estos valores serán abordados
más adelante.
3. Atributos y valores
Atributos
Como observamos en la parte de la sintaxis de CSS, los atributos y valores en son fáciles de
utilizar. Solo indicamos el nombre del atributo seguido de dos puntos y el valor que
tomará el atributo.
Valores
Los valores en CSS pueden ser numéricos, booleanos o cad
+
Comentarios de: Curso de CSS (0)
No hay comentarios