Computación

9no. Grado

Lenguaje CSS

Cascading Style Sheets

Actividad 11

CSS | Hojas de Estilo en Cascada

Sintaxis y Elementos CSS

Reglas de Estilo

Propiedades o Estilos

Estructura

Selector ejemplo: body {

Bloque de Declaraciones entre llaves { }

Propiedad y Valor ejemplo: backgroud-color: blue;

Separador de Declaraciones ;

Sintaxis

Regla:

selector {

propiedad: valor; (declaración)

}

Modos CSS

Selector en <head>

Etiqueta
Class
Id

a. Selector Etiqueta

<head>

<style>

header {

background-color: #333;

}

</style>

</head>

<body>

<header><h1>Título de Contenido</h1></header>

</body>

b. Selector Clase

<head>

<style>

.box {

background-color: #333;

}

</style>

</head>

<body>

</div>

</body>

c. Selector Id

<head>

<style>

#content {

text-align: justify;

}

</style>

</head>

<body>

</div>

</body>

CSS en línea

<p style="font-family: verdana;">Texto de Contenido</p>

<p>Texto de <span style="color: red;">Contenido</span> en un párrafo.</p>

Archivo CSS (estilos.css)

<head>

</head>

En el archivo estilos.css

p {

text-align: center;

}

Computación

9no. Grado

Lenguaje CSS

Actividad 11

CSS | Hojas de Estilo en Cascada

Sintaxis y Elementos CSS

Modos CSS

Selector en <head>

a. Selector Etiqueta

b. Selector Clase

c. Selector Id

CSS en línea

Archivo CSS (estilos.css)