SlideShare una empresa de Scribd logo
1 de 10
QUE ES CSS Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos. http://www.w3.org
¿Para qué sirve? CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los  Estilos  definen la forma de mostrar los elementos HTML y XML. CSS 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.
CSS funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más elementos. Las hojas de estilo están compuestas por una o más de esas reglas aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la declaración. A su vez la declaración está compuesta por una propiedad y el valor que se le asigne. h1 {color: red;}  h1 es el selector {color: red;} es la declaración
Utilizando una hoja de estilo externa que estará vinculada a un documento a través del elemento <link>, el cual debe ir situado en la sección <head>.  <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot;>  <html>  <head> <title>Título</title>  <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://www.w3.org/css/officeFloats.css&quot; />   </head>  <body> . . . . </body>  </html>
Utilizando el elemento <style>, en el interior del documento al que se le quiere dar estilo, y que generalmente se situaría en la sección <head>. De esta forma los estilos serán reconocidos antes de que la página se cargue por completo.
<!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot;>  <html>  <head> <title>hoja de estilo interna</title>  <style type=&quot;text/css&quot;>  body { padding-left: 11em; font-family: Georgia, &quot;Times New Roman&quot;, serif; color: red; background-color: #d8da3d;  }
h1 { font-family: Helvetica, Geneva, Arial, sans-serif; } </style>   </head>  <body> <h1>Aquí se aplicará el estilo de letra para el Título</h1>  </body>  </html>
h1, h2, h3 { color: red; }  FORMA 2 h1 {color: red;}  h2 {color: red;}  h3 {color: red;} p {text-align:center;color:red} h1 { padding-left: 11em; font-family: Georgia, &quot;Times New Roman&quot;,Times, serif; color: red; background-color: #d8da3d; }
Una hoja de estilo externa , que es una hoja de estilo que está almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web. Esta es la manera de programar más potente, porque separa completamente las reglas de formateo para la página HTML de la estructura básica de la página.  Una hoja de estilo interna , que es una hoja de estilo que está incrustada dentro de un documento HTML. (Va a la derecha dentro del elemento <head>). De esta manera se obtiene el beneficio de separar la información del estilo, del código HTML propiamente dicho. Se puede optar por copiar la hoja de estilo incrustada de una página a otra, (esta posibilidad es difícil de ejecutar si se desea para guardar las copias sincronizadas). En general, la única vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna característica a una página Web en un simple fichero, por ejemplo, si se está enviando algo a la página web.  Un estilo en línea , que es un método para insertar el lenguaje de estilo de página, directamente, dentro de una etiqueta HTML. Esta manera de proceder no es excesivamente adecuada. El incrustar la descripción del formateo dentro del documento de la página Web, a nivel de código se convierte en una tarea larga, tediosa y poco elegante de resolver el problema de la programación de la página. Este modo de trabajo se podría usar de manera ocasional si se pretende aplicar un formateo con prisa, al vuelo. No es todo lo claro, o estructurado, que debería ser, pero funciona.
 

Más contenido relacionado

La actualidad más candente (18)

Hojas de estilo CSS
Hojas de estilo CSSHojas de estilo CSS
Hojas de estilo CSS
 
Informática
InformáticaInformática
Informática
 
Estilos cascadas
Estilos cascadasEstilos cascadas
Estilos cascadas
 
Html y tags
Html y tagsHtml y tags
Html y tags
 
Etiquetas de lenguaje html
Etiquetas de lenguaje htmlEtiquetas de lenguaje html
Etiquetas de lenguaje html
 
Primeraclase
PrimeraclasePrimeraclase
Primeraclase
 
Web
WebWeb
Web
 
Jessica
JessicaJessica
Jessica
 
Esilo css
Esilo cssEsilo css
Esilo css
 
Html y tags
Html y tagsHtml y tags
Html y tags
 
Lenguaje html
Lenguaje htmlLenguaje html
Lenguaje html
 
Html y tags
Html y tagsHtml y tags
Html y tags
 
Retroalimentación 2011 Lopez, Carlos
Retroalimentación 2011 Lopez, CarlosRetroalimentación 2011 Lopez, Carlos
Retroalimentación 2011 Lopez, Carlos
 
Pagina web 1
Pagina web 1Pagina web 1
Pagina web 1
 
Unidad 2
Unidad 2Unidad 2
Unidad 2
 
Jessica
JessicaJessica
Jessica
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
Documento nicolas garibello
Documento nicolas garibelloDocumento nicolas garibello
Documento nicolas garibello
 

Destacado

Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje cssDiivenii Sykes
 
Guía Básica de CSS
Guía Básica de CSSGuía Básica de CSS
Guía Básica de CSSMariano Jofre
 
Tema 3 - Introducción a HTML
Tema 3 - Introducción a HTMLTema 3 - Introducción a HTML
Tema 3 - Introducción a HTMLPamela Rodriguez
 
Tema 7 - Introducción a html con css
Tema 7 - Introducción a html con cssTema 7 - Introducción a html con css
Tema 7 - Introducción a html con cssPamela Rodriguez
 
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 blogspotLISSYCE
 
Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje cssSimoney Llamas
 
CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?Harold Maduro
 
Manual Celta 2015 da Chevrolet
Manual Celta 2015 da ChevroletManual Celta 2015 da Chevrolet
Manual Celta 2015 da ChevroletSérgio Amaral
 
Introducción a HTML y CSS
Introducción a HTML y CSSIntroducción a HTML y CSS
Introducción a HTML y CSSAdriana Tienda
 
HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?Maximiliano Martin
 
Maquetado con HTML y CSS
Maquetado con HTML y CSSMaquetado con HTML y CSS
Maquetado con HTML y CSSManuel Razzari
 

Destacado (20)

Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje css
 
Guía Básica de CSS
Guía Básica de CSSGuía Básica de CSS
Guía Básica de CSS
 
Css
CssCss
Css
 
Terminología Web
Terminología WebTerminología Web
Terminología Web
 
Css (cascading style sheets)
Css (cascading style sheets)Css (cascading style sheets)
Css (cascading style sheets)
 
Tema 3 - Introducción a HTML
Tema 3 - Introducción a HTMLTema 3 - Introducción a HTML
Tema 3 - Introducción a HTML
 
html y css
html y csshtml y css
html y css
 
Tema 7 - Introducción a html con css
Tema 7 - Introducción a html con cssTema 7 - Introducción a html con css
Tema 7 - Introducción a html con 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
 
Identificación del lenguaje ccs
Identificación del lenguaje ccsIdentificación del lenguaje ccs
Identificación del lenguaje ccs
 
Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje css
 
CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?
 
Maquetación web
Maquetación webMaquetación web
Maquetación web
 
Manual Celta 2015 da Chevrolet
Manual Celta 2015 da ChevroletManual Celta 2015 da Chevrolet
Manual Celta 2015 da Chevrolet
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
Introducción a HTML y CSS
Introducción a HTML y CSSIntroducción a HTML y CSS
Introducción a HTML y CSS
 
LENGUAJE HTML
LENGUAJE HTMLLENGUAJE HTML
LENGUAJE HTML
 
Html
HtmlHtml
Html
 
HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?
 
Maquetado con HTML y CSS
Maquetado con HTML y CSSMaquetado con HTML y CSS
Maquetado con HTML y CSS
 

Similar a Css (20)

Dhtml
DhtmlDhtml
Dhtml
 
Hojas de estilo (css)
Hojas de estilo (css)Hojas de estilo (css)
Hojas de estilo (css)
 
Manual de css......jpg
Manual de css......jpgManual de css......jpg
Manual de css......jpg
 
Presentación
PresentaciónPresentación
Presentación
 
Manual de css hojas de estilo
Manual de css hojas de estiloManual de css hojas de estilo
Manual de css hojas de estilo
 
Html
HtmlHtml
Html
 
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
 
Taller 1 mariana barreto
Taller 1 mariana barretoTaller 1 mariana barreto
Taller 1 mariana barreto
 
Html
HtmlHtml
Html
 
Html presentacion
Html presentacionHtml presentacion
Html presentacion
 
Presentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTMLPresentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTML
 
Expo html
Expo htmlExpo html
Expo html
 
Qué es el html
Qué es el htmlQué es el html
Qué es el html
 
Html
HtmlHtml
Html
 
Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
 
Css
CssCss
Css
 
Clase 04 Html
Clase 04   HtmlClase 04   Html
Clase 04 Html
 
Hojas de estilo_css
Hojas de estilo_cssHojas de estilo_css
Hojas de estilo_css
 

Más de Securinf.com Seguridad Informatica - Tecnoweb2.com

Más de Securinf.com Seguridad Informatica - Tecnoweb2.com (20)

Completo conferencia seguridad_web_software_libre_2015
Completo conferencia seguridad_web_software_libre_2015Completo conferencia seguridad_web_software_libre_2015
Completo conferencia seguridad_web_software_libre_2015
 
Presentacion Guia OWASP 2014
Presentacion Guia OWASP 2014Presentacion Guia OWASP 2014
Presentacion Guia OWASP 2014
 
Emprendiendo con software libre-
 Emprendiendo con software libre- Emprendiendo con software libre-
Emprendiendo con software libre-
 
Jsl Colombia 2010 - Seguridad Informatica
Jsl Colombia 2010 - Seguridad InformaticaJsl Colombia 2010 - Seguridad Informatica
Jsl Colombia 2010 - Seguridad Informatica
 
Jsl ponencias v2_diego_salazar_perez
Jsl ponencias v2_diego_salazar_perezJsl ponencias v2_diego_salazar_perez
Jsl ponencias v2_diego_salazar_perez
 
Criptografia-GSeguridad
Criptografia-GSeguridadCriptografia-GSeguridad
Criptografia-GSeguridad
 
Linux seguro - Fedora Colombia
Linux seguro - Fedora ColombiaLinux seguro - Fedora Colombia
Linux seguro - Fedora Colombia
 
Certificacion iso17799 iso 27001 1
Certificacion iso17799 iso 27001 1Certificacion iso17799 iso 27001 1
Certificacion iso17799 iso 27001 1
 
Python workshop
Python workshopPython workshop
Python workshop
 
De Presa A Cazador
De Presa A Cazador De Presa A Cazador
De Presa A Cazador
 
Web 20 vision a la industria
Web 20 vision a la industriaWeb 20 vision a la industria
Web 20 vision a la industria
 
Open solaris
Open solarisOpen solaris
Open solaris
 
Hacking withinnails pdfcompleto
Hacking withinnails pdfcompletoHacking withinnails pdfcompleto
Hacking withinnails pdfcompleto
 
Análisis malware
Análisis malwareAnálisis malware
Análisis malware
 
Sftp rodrigo carreño
Sftp rodrigo carreñoSftp rodrigo carreño
Sftp rodrigo carreño
 
Instalacion drupal 1
Instalacion drupal 1Instalacion drupal 1
Instalacion drupal 1
 
Instalacion drupal 1
Instalacion drupal 1Instalacion drupal 1
Instalacion drupal 1
 
C:\Fake Path\Cauca
C:\Fake Path\CaucaC:\Fake Path\Cauca
C:\Fake Path\Cauca
 
Presentacion Joomla CMS
Presentacion Joomla CMSPresentacion Joomla CMS
Presentacion Joomla CMS
 
Securinf Barcamp
Securinf BarcampSecurinf Barcamp
Securinf Barcamp
 

Último

Red Dorsal Nacional de Fibra Óptica y Redes Regionales del Perú
Red Dorsal Nacional de Fibra Óptica y Redes Regionales del PerúRed Dorsal Nacional de Fibra Óptica y Redes Regionales del Perú
Red Dorsal Nacional de Fibra Óptica y Redes Regionales del PerúCEFERINO DELGADO FLORES
 
La Electricidad Y La Electrónica Trabajo Tecnología.pdf
La Electricidad Y La Electrónica Trabajo Tecnología.pdfLa Electricidad Y La Electrónica Trabajo Tecnología.pdf
La Electricidad Y La Electrónica Trabajo Tecnología.pdfjeondanny1997
 
GonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptxGonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptx241523733
 
tarea de exposicion de senati zzzzzzzzzz
tarea de exposicion de senati zzzzzzzzzztarea de exposicion de senati zzzzzzzzzz
tarea de exposicion de senati zzzzzzzzzzAlexandergo5
 
Herramientas que posibilitan la información y la investigación.pdf
Herramientas que posibilitan la información y la investigación.pdfHerramientas que posibilitan la información y la investigación.pdf
Herramientas que posibilitan la información y la investigación.pdfKarinaCambero3
 
Slideshare y Scribd - Noli Cubillan Gerencia
Slideshare y Scribd - Noli Cubillan GerenciaSlideshare y Scribd - Noli Cubillan Gerencia
Slideshare y Scribd - Noli Cubillan Gerenciacubillannoly
 
FloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptxFloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptx241522327
 
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).ppt
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).pptLUXOMETRO EN SALUD OCUPACIONAL(FINAL).ppt
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).pptchaverriemily794
 
Trabajo de tecnología excel avanzado.pdf
Trabajo de tecnología excel avanzado.pdfTrabajo de tecnología excel avanzado.pdf
Trabajo de tecnología excel avanzado.pdfedepmariaperez
 
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptx
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptxEl_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptx
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptxAlexander López
 
Documentacion Electrónica en Actos Juridicos
Documentacion Electrónica en Actos JuridicosDocumentacion Electrónica en Actos Juridicos
Documentacion Electrónica en Actos JuridicosAlbanyMartinez7
 
Análisis de Artefactos Tecnologicos (3) (1).pdf
Análisis de Artefactos Tecnologicos  (3) (1).pdfAnálisis de Artefactos Tecnologicos  (3) (1).pdf
Análisis de Artefactos Tecnologicos (3) (1).pdfsharitcalderon04
 
Presentación sobre la Inteligencia Artificial
Presentación sobre la Inteligencia ArtificialPresentación sobre la Inteligencia Artificial
Presentación sobre la Inteligencia Artificialcynserafini89
 
Los Microcontroladores PIC, Aplicaciones
Los Microcontroladores PIC, AplicacionesLos Microcontroladores PIC, Aplicaciones
Los Microcontroladores PIC, AplicacionesEdomar AR
 
CommitConf 2024 - Spring Boot <3 Testcontainers
CommitConf 2024 - Spring Boot <3 TestcontainersCommitConf 2024 - Spring Boot <3 Testcontainers
CommitConf 2024 - Spring Boot <3 TestcontainersIván López Martín
 
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptx
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptxModelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptx
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptxtjcesar1
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxAlexander López
 
certificado de oracle academy cetrificado.pdf
certificado de oracle academy cetrificado.pdfcertificado de oracle academy cetrificado.pdf
certificado de oracle academy cetrificado.pdfFernandoOblitasVivan
 
Tecnologias Starlink para el mundo tec.pptx
Tecnologias Starlink para el mundo tec.pptxTecnologias Starlink para el mundo tec.pptx
Tecnologias Starlink para el mundo tec.pptxGESTECPERUSAC
 

Último (20)

Red Dorsal Nacional de Fibra Óptica y Redes Regionales del Perú
Red Dorsal Nacional de Fibra Óptica y Redes Regionales del PerúRed Dorsal Nacional de Fibra Óptica y Redes Regionales del Perú
Red Dorsal Nacional de Fibra Óptica y Redes Regionales del Perú
 
La Electricidad Y La Electrónica Trabajo Tecnología.pdf
La Electricidad Y La Electrónica Trabajo Tecnología.pdfLa Electricidad Y La Electrónica Trabajo Tecnología.pdf
La Electricidad Y La Electrónica Trabajo Tecnología.pdf
 
GonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptxGonzalezGonzalez_Karina_M1S3AI6... .pptx
GonzalezGonzalez_Karina_M1S3AI6... .pptx
 
tarea de exposicion de senati zzzzzzzzzz
tarea de exposicion de senati zzzzzzzzzztarea de exposicion de senati zzzzzzzzzz
tarea de exposicion de senati zzzzzzzzzz
 
Herramientas que posibilitan la información y la investigación.pdf
Herramientas que posibilitan la información y la investigación.pdfHerramientas que posibilitan la información y la investigación.pdf
Herramientas que posibilitan la información y la investigación.pdf
 
Slideshare y Scribd - Noli Cubillan Gerencia
Slideshare y Scribd - Noli Cubillan GerenciaSlideshare y Scribd - Noli Cubillan Gerencia
Slideshare y Scribd - Noli Cubillan Gerencia
 
FloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptxFloresMorales_Montserrath_M1S3AI6 (1).pptx
FloresMorales_Montserrath_M1S3AI6 (1).pptx
 
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).ppt
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).pptLUXOMETRO EN SALUD OCUPACIONAL(FINAL).ppt
LUXOMETRO EN SALUD OCUPACIONAL(FINAL).ppt
 
Trabajo de tecnología excel avanzado.pdf
Trabajo de tecnología excel avanzado.pdfTrabajo de tecnología excel avanzado.pdf
Trabajo de tecnología excel avanzado.pdf
 
El camino a convertirse en Microsoft MVP
El camino a convertirse en Microsoft MVPEl camino a convertirse en Microsoft MVP
El camino a convertirse en Microsoft MVP
 
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptx
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptxEl_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptx
El_Blog_como_herramienta_de_publicacion_y_consulta_de_investigacion.pptx
 
Documentacion Electrónica en Actos Juridicos
Documentacion Electrónica en Actos JuridicosDocumentacion Electrónica en Actos Juridicos
Documentacion Electrónica en Actos Juridicos
 
Análisis de Artefactos Tecnologicos (3) (1).pdf
Análisis de Artefactos Tecnologicos  (3) (1).pdfAnálisis de Artefactos Tecnologicos  (3) (1).pdf
Análisis de Artefactos Tecnologicos (3) (1).pdf
 
Presentación sobre la Inteligencia Artificial
Presentación sobre la Inteligencia ArtificialPresentación sobre la Inteligencia Artificial
Presentación sobre la Inteligencia Artificial
 
Los Microcontroladores PIC, Aplicaciones
Los Microcontroladores PIC, AplicacionesLos Microcontroladores PIC, Aplicaciones
Los Microcontroladores PIC, Aplicaciones
 
CommitConf 2024 - Spring Boot <3 Testcontainers
CommitConf 2024 - Spring Boot <3 TestcontainersCommitConf 2024 - Spring Boot <3 Testcontainers
CommitConf 2024 - Spring Boot <3 Testcontainers
 
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptx
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptxModelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptx
Modelo de Presentacion Feria Robotica Educativa 2024 - Versión3.pptx
 
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptxLAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
LAS_TIC_COMO_HERRAMIENTAS_EN_LA_INVESTIGACIÓN.pptx
 
certificado de oracle academy cetrificado.pdf
certificado de oracle academy cetrificado.pdfcertificado de oracle academy cetrificado.pdf
certificado de oracle academy cetrificado.pdf
 
Tecnologias Starlink para el mundo tec.pptx
Tecnologias Starlink para el mundo tec.pptxTecnologias Starlink para el mundo tec.pptx
Tecnologias Starlink para el mundo tec.pptx
 

Css

  • 1. QUE ES CSS Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos. http://www.w3.org
  • 2. ¿Para qué sirve? CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y XML. CSS 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. CSS funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más elementos. Las hojas de estilo están compuestas por una o más de esas reglas aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la declaración. A su vez la declaración está compuesta por una propiedad y el valor que se le asigne. h1 {color: red;} h1 es el selector {color: red;} es la declaración
  • 4. Utilizando una hoja de estilo externa que estará vinculada a un documento a través del elemento <link>, el cual debe ir situado en la sección <head>. <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot;> <html> <head> <title>Título</title> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://www.w3.org/css/officeFloats.css&quot; /> </head> <body> . . . . </body> </html>
  • 5. Utilizando el elemento <style>, en el interior del documento al que se le quiere dar estilo, y que generalmente se situaría en la sección <head>. De esta forma los estilos serán reconocidos antes de que la página se cargue por completo.
  • 6. <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.1//EN&quot;> <html> <head> <title>hoja de estilo interna</title> <style type=&quot;text/css&quot;> body { padding-left: 11em; font-family: Georgia, &quot;Times New Roman&quot;, serif; color: red; background-color: #d8da3d; }
  • 7. h1 { font-family: Helvetica, Geneva, Arial, sans-serif; } </style> </head> <body> <h1>Aquí se aplicará el estilo de letra para el Título</h1> </body> </html>
  • 8. h1, h2, h3 { color: red; } FORMA 2 h1 {color: red;} h2 {color: red;} h3 {color: red;} p {text-align:center;color:red} h1 { padding-left: 11em; font-family: Georgia, &quot;Times New Roman&quot;,Times, serif; color: red; background-color: #d8da3d; }
  • 9. Una hoja de estilo externa , que es una hoja de estilo que está almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web. Esta es la manera de programar más potente, porque separa completamente las reglas de formateo para la página HTML de la estructura básica de la página. Una hoja de estilo interna , que es una hoja de estilo que está incrustada dentro de un documento HTML. (Va a la derecha dentro del elemento <head>). De esta manera se obtiene el beneficio de separar la información del estilo, del código HTML propiamente dicho. Se puede optar por copiar la hoja de estilo incrustada de una página a otra, (esta posibilidad es difícil de ejecutar si se desea para guardar las copias sincronizadas). En general, la única vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna característica a una página Web en un simple fichero, por ejemplo, si se está enviando algo a la página web. Un estilo en línea , que es un método para insertar el lenguaje de estilo de página, directamente, dentro de una etiqueta HTML. Esta manera de proceder no es excesivamente adecuada. El incrustar la descripción del formateo dentro del documento de la página Web, a nivel de código se convierte en una tarea larga, tediosa y poco elegante de resolver el problema de la programación de la página. Este modo de trabajo se podría usar de manera ocasional si se pretende aplicar un formateo con prisa, al vuelo. No es todo lo claro, o estructurado, que debería ser, pero funciona.
  • 10.