SESIÓN 21

TEMAS:
• CODIFICACIÓN EN CSS

DOCENTE: Ing. Flor Edith Huamán Huamán

 CSS
Los códigos CSS o en español Hojas de estilo en cascada (siglas en
inglés de Cascading Stylesheets) es un lenguaje de diseño gráfico
para definir y crear la presentación de un documento estructurado
escrito en un lenguaje de marcado.
CSS es un código que funciona junto a HTML y sirve
para modificar todo lo relacionado con el estilo, es decir, colores,
tipografías, tamaños, etc.
Por ejemplo, mediante una regla CSS puedo redefinir el
estilo de todas las etiquetas h1 (títulos 1 de mi web) para que a partir
de ahora tengan un tamaño de 36 píxeles, color negro y tipografía
Open Sans. El modo de hacerlo sería colocando el siguiente código en
la hoja de estilos CSS.
 CSS
Mientras que los comandos HTML le indican al navegador que ciertas
partes del texto son títulos, subtítulos, enlaces o párrafos, CSS es lo
que le dice, entre otras cosas, qué fuente, tamaño, color o alineación
debe tener un elemento de la página.
h1 {
font-size: 36px;
color: #000;
Font-family: ‘Open Sans‘
}
 ¿PARA QUÉ SIRVE EL CSS?

El lenguaje CSS se ha convertido en una revolución en el ámbito del diseño

web especialmente. Entre los beneficios que se encuentran al utilizar éste
se destacan los siguientes:
Más precisión: Cuando se utiliza CSS, el tamaño y posicionamiento de los
elementos que conforman las web será exacto. Se le puede indicar al
navegador en qué píxel colocar una determinada imagen, así como las
medidas de éstas.
El CSS da mejor accesibilidad y estructura. Al combinar el lenguaje CSS y
los marcadores descriptivos se posibilita que una web se vea
correctamente puesto que la información se mantendrá estructurada y
ordenada.
Mejora los tiempos de carga: Con la introducción del CSS se ha dividido
contenido y apariencia, por lo que se obtienen archivos más ligeros. Esto
es ventajoso para reducir los tiempos de carga del sitio en el navegador y
bajar el volumen de tráfico del servidor que se ha escogido.
 VENTAJAS DE CSS
La diferencia entre un sitio web que implementa CSS y uno que no, es
enorme y definitivamente se nota.
Quizás hayas visto algún sitio web que no se puede cargar por
completo y tiene un fondo blanco con la mayor parte del texto en azul
y negro. Eso significa que la parte CSS del sitio no se cargó
correctamente o no existe.
Así es como se ve un sitio con solo HTML, y creo que estarás de
acuerdo conmigo en que no luce muy bien.
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.
 ¿CÓMO SE VINCULAN EL CSS Y EL
HTML?

El HTML y CSS tienen una relación muy fuerte entre ellos, ya que el
HTML es un lenguaje de marcado (constituye la base de un sitio web) y
CSS define el estilo de la página (toda la parte estética).
A pesar de que las Hojas de Estilo en Cascada no son imprescindibles,
son importantes para darle forma y apariencia a tu página web. Si
solo usas HTML tu página se verá desnuda y no destacará entre la
competencia.
 EN RESUMEN

El CSS fue creado para trabajar en conjunto con el HTML. Y debido al

concepto que utiliza (la separación de presentación y contenido), la
tecnología CSS tiene un estándar muy amplio, con especificaciones,
beneficios y posibilidades muy grandes.
Hoy en día encontrarás al CSS en la mayoría de páginas web, ya que es
un requisito tan importante como el propio lenguaje de marcado, ¡no dejes
de implementarlo en tu sitio web!
En resumen, con CSS no tienes que describir repetidamente cómo se ven los
elementos individuales. Esto ahorra tiempo, hace el código más corto y
menos propenso a errores.
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.