SlideShare una empresa de Scribd logo
1 de 7
Descargar para leer sin conexión
FACILITADOR: MORENO DUGLAS
Cascading Style Sheets (CSS) Hojas de Estilo
en Cascada

se utiliza para darle estilo a los documentos separando el
contenido de la presentación. Los Estilos definen la
forma de mostrar los elementos HTML.

CSS le permite a los desarrolladores Web controlar el
estilo y el formato de múltiples páginas Web al mismo
tiempo. Cualquier cambio en el estilo marcado para un
elemento en la CSS afectará a todas las páginas
vinculadas a esa CSS en las que aparezca ese
elemento.
Formas para Crear los Estilos
Se crear la hoja de Estilo y se incluye en el
archivo Html de la siguiente forma.

<link rel="stylesheet" type="text/css"
href=" " />
Formas para Crear los Estilos
Se puede Utilizar el elemento <style></style> en el interior
Del documento dentro del HEAD Ejemplo:

<html>
<head><title>hoja de estilo interna</title>
<style type="text/css">

  </style>
</head><body></body></html>
Creando una hoja de estilo dentro de un
        documento, el tag <STYLE>
<HTML> <HEAD>
Diversos datos de la cabeza del documento.....
<STYLE type="text/css">
<!--
Definición de los diversos estilos y sus
   características.
-->
</STYLE>
</HEAD> <BODY>
Contenido del documento...
</BODY> </HTML>
Formas para Crear los Estilos
Se pueden utilizar los estilos “in line” que solo
se utilizara una ve, y se definen los valores de
la propiedad style. Ejemplo:

<p style="color:blue;background:lightblue;">
Aca va un parrafo en azul, resaltado y en
negrita
</p>
Algunas propiedades de las hojas de estilo que
permiten cambiar la forma de presentación de los
documentos de html.

Las hojas de estilos se pueden diseñar de dos formas
que    describen una clase (CLASS) y los que
describen los identificadores (ID).

Más contenido relacionado

La actualidad más candente (19)

Html vs css
Html vs cssHtml vs css
Html vs css
 
Hojas de estilo CSS
Hojas de estilo CSSHojas de estilo CSS
Hojas de estilo CSS
 
Colegio nicolás esguerra
Colegio nicolás esguerraColegio nicolás esguerra
Colegio nicolás esguerra
 
Planilla
PlanillaPlanilla
Planilla
 
Modelo carta urbana
Modelo carta urbanaModelo carta urbana
Modelo carta urbana
 
Octavo
OctavoOctavo
Octavo
 
Css hojasde estilo
Css hojasde estiloCss hojasde estilo
Css hojasde estilo
 
Colegio nacional nicolas
Colegio nacional nicolasColegio nacional nicolas
Colegio nacional nicolas
 
Css básico
Css básicoCss básico
Css básico
 
Herramientas de word
Herramientas de wordHerramientas de word
Herramientas de word
 
CSS EN HTML5
CSS EN HTML5CSS EN HTML5
CSS EN HTML5
 
Css
CssCss
Css
 
Qué es css
Qué es cssQué es css
Qué es css
 
Css
CssCss
Css
 
Computación en la nube skydrive
Computación en la nube skydriveComputación en la nube skydrive
Computación en la nube skydrive
 
Computacion en la nube sky drive
Computacion en la nube   sky driveComputacion en la nube   sky drive
Computacion en la nube sky drive
 
Vista
VistaVista
Vista
 
Hojas de estilo (1)
Hojas de estilo (1)Hojas de estilo (1)
Hojas de estilo (1)
 
Conceptos Básicos CSS
Conceptos Básicos CSSConceptos Básicos CSS
Conceptos Básicos CSS
 

Similar a Hojas estilo (20)

Hojas de estilo (css)
Hojas de estilo (css)Hojas de estilo (css)
Hojas de estilo (css)
 
1. Introducción a las Hojas de estilo (CSS)
1. Introducción a las Hojas de estilo (CSS)1. Introducción a las Hojas de estilo (CSS)
1. Introducción a las Hojas de estilo (CSS)
 
C3 lenguaje de presentación.
C3 lenguaje de presentación.C3 lenguaje de presentación.
C3 lenguaje de presentación.
 
Presentación
PresentaciónPresentación
Presentación
 
Css
CssCss
Css
 
Presenpabo
PresenpaboPresenpabo
Presenpabo
 
05 desarrollocss (3)
05 desarrollocss (3)05 desarrollocss (3)
05 desarrollocss (3)
 
Organización de contenido en dreamweaver
Organización de contenido en dreamweaverOrganización de contenido en dreamweaver
Organización de contenido en dreamweaver
 
manualrapido_css.pdf
manualrapido_css.pdfmanualrapido_css.pdf
manualrapido_css.pdf
 
manua.pdf
manua.pdfmanua.pdf
manua.pdf
 
Manualrapido css
Manualrapido cssManualrapido css
Manualrapido css
 
Paginas web css
Paginas web cssPaginas web css
Paginas web css
 
Introducción a css
Introducción a cssIntroducción a css
Introducción a css
 
css
csscss
css
 
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspotDEBER HOJA DE ESTILO (CSS) blog blogger blogspot
DEBER HOJA DE ESTILO (CSS) blog blogger blogspot
 
Css.html(1)
Css.html(1)Css.html(1)
Css.html(1)
 
Hojas de estilo_css
Hojas de estilo_cssHojas de estilo_css
Hojas de estilo_css
 
Manual de css......jpg
Manual de css......jpgManual de css......jpg
Manual de css......jpg
 
Trabajo css
Trabajo cssTrabajo css
Trabajo css
 
Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje css
 

Más de Duglas Oswaldo Moreno Mendoza

Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación Virtual
Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación VirtualMoodle como una herramienta de Enseñanza y Aprendizaje en la Educación Virtual
Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación VirtualDuglas Oswaldo Moreno Mendoza
 

Más de Duglas Oswaldo Moreno Mendoza (20)

Fases dek Diseño Instruccional
Fases dek Diseño InstruccionalFases dek Diseño Instruccional
Fases dek Diseño Instruccional
 
Diseño Instruccional
Diseño InstruccionalDiseño Instruccional
Diseño Instruccional
 
Ponencia Seguridad de Datos
Ponencia Seguridad de DatosPonencia Seguridad de Datos
Ponencia Seguridad de Datos
 
Sematicas cabecera
Sematicas cabeceraSematicas cabecera
Sematicas cabecera
 
Nuevas Etiquetas
Nuevas EtiquetasNuevas Etiquetas
Nuevas Etiquetas
 
Meta etiquetas
Meta etiquetasMeta etiquetas
Meta etiquetas
 
Formularios
FormulariosFormularios
Formularios
 
Elementos de audio
Elementos de audioElementos de audio
Elementos de audio
 
Introducción al HTML
Introducción al HTML Introducción al HTML
Introducción al HTML
 
Infografia de PHP
Infografia de PHPInfografia de PHP
Infografia de PHP
 
Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación Virtual
Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación VirtualMoodle como una herramienta de Enseñanza y Aprendizaje en la Educación Virtual
Moodle como una herramienta de Enseñanza y Aprendizaje en la Educación Virtual
 
Una biografía que es como un cuento
Una biografía que es como un cuentoUna biografía que es como un cuento
Una biografía que es como un cuento
 
INFOGRAFIA DE PHP
INFOGRAFIA DE PHPINFOGRAFIA DE PHP
INFOGRAFIA DE PHP
 
Observador del conocimmiento n°1 vol 2
Observador del conocimmiento n°1 vol 2Observador del conocimmiento n°1 vol 2
Observador del conocimmiento n°1 vol 2
 
Observador del conocimmiento n°1 vol 1
Observador del conocimmiento n°1 vol 1Observador del conocimmiento n°1 vol 1
Observador del conocimmiento n°1 vol 1
 
Manual programacion Android
Manual programacion AndroidManual programacion Android
Manual programacion Android
 
Variables y Bucles
Variables y BuclesVariables y Bucles
Variables y Bucles
 
Historia de PHP
Historia de PHPHistoria de PHP
Historia de PHP
 
Web 2.0
Web 2.0Web 2.0
Web 2.0
 
Clase tres de xhtml
Clase tres de xhtmlClase tres de xhtml
Clase tres de xhtml
 

Último

Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroJuan Carlos Fonseca Mata
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialAndreaMlaga1
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisbrasilyamile
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddabuitragoi
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasRiegosVeracruz
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHEgonzalezdfidelibus
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfcucciolosfabrica
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoJorge Fernandez
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfslaimenbarakat
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturajesusgrosales12
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfAdrianaCarolinaMoral2
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoWilsonChambi4
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio2021ArqROLDANBERNALD
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Modernasofpaolpz
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesespejosflorida
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfhellotunahaus
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOManuelBustamante49
 
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna  Walter Gropius- Frank Lloyd WrightArquitectura Moderna  Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna Walter Gropius- Frank Lloyd Wrightimariagsg
 

Último (20)

Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de Querétaro
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especial
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratis
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidad
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicas
 
Arte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusaArte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusa
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdf
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimiento
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitectura
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
 
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientes
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdf
 
1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
 
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna  Walter Gropius- Frank Lloyd WrightArquitectura Moderna  Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
 

Hojas estilo

  • 2. Cascading Style Sheets (CSS) Hojas de Estilo en Cascada se utiliza para darle estilo a los documentos separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML. CSS le permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento.
  • 3. Formas para Crear los Estilos Se crear la hoja de Estilo y se incluye en el archivo Html de la siguiente forma. <link rel="stylesheet" type="text/css" href=" " />
  • 4. Formas para Crear los Estilos Se puede Utilizar el elemento <style></style> en el interior Del documento dentro del HEAD Ejemplo: <html> <head><title>hoja de estilo interna</title> <style type="text/css"> </style> </head><body></body></html>
  • 5. Creando una hoja de estilo dentro de un documento, el tag <STYLE> <HTML> <HEAD> Diversos datos de la cabeza del documento..... <STYLE type="text/css"> <!-- Definición de los diversos estilos y sus características. --> </STYLE> </HEAD> <BODY> Contenido del documento... </BODY> </HTML>
  • 6. Formas para Crear los Estilos Se pueden utilizar los estilos “in line” que solo se utilizara una ve, y se definen los valores de la propiedad style. Ejemplo: <p style="color:blue;background:lightblue;"> Aca va un parrafo en azul, resaltado y en negrita </p>
  • 7. Algunas propiedades de las hojas de estilo que permiten cambiar la forma de presentación de los documentos de html. Las hojas de estilos se pueden diseñar de dos formas que describen una clase (CLASS) y los que describen los identificadores (ID).