SlideShare una empresa de Scribd logo
El nombre hojas de estilo en cascada viene
  del inglés Cascading Style Sheets, del que toma
sus siglas. CSS es un lenguaje usado para definir la
    presentación de un documento estructurado
      escrito en HTML o XML (y por extensión
       en XHTML). El W3C (World Wide Web
    Consortium) es el encargado de formular la
 especificación de las hojas de estilo que servirán
           de estándar para los agentes de
               usuario o navegadores.
La información de estilo puede ser adjuntada como
 un documento separado o en el mismo documento
   HTML. En este último caso podrían definirse
 estilos generales en la cabecera del documento o
 en cada etiqueta particular mediante el atributo
                      "<style>"
Por ejemplo, el elemento de HTML <h1> indica que un bloque de
  texto es un encabezamiento y que es más importante que un
bloque etiquetado como <h2>. Versiones más antiguas de HTML
 permitían atributos extra dentro de la etiqueta abierta para
    darle formato (como el color o el tamaño de fuente). No
obstante, cada etiqueta <h1> debía disponer de la información si
       se deseaba un diseño consistente para una página
         y, además, una persona que leía esa página con
un navegador perdía totalmente el control sobre la visualización
                            del texto.
Cuando se utiliza CSS, la etiqueta <h1> no debería proporcionar
 información sobre cómo será visualizado, solamente marca la
 estructura del documento. La información de estilo, separada
 en una hoja de estilo, especifica cómo se ha de mostrar <h1>:
       color, fuente, alineación del texto, tamaño y otras
     características no visuales, como definir el volumen de
               un sintetizador de voz, por ejemplo.
 Por otro lado, antes de que estuviera disponible CSS, la única
   forma de componer espacialmente una página era el uso de
                          tablas <table>.
Borde en CSS
         <html>
         <head>
         <style type="text/css">
         p
         {
         border: medium double rgb(250,0,255)
         }
         </style>
         </head>
         <body>
         <p>Texto rodeado por borde en CSS</p>
         </body>
         </html>



Botón de Formulario en CSS
<input type="image" src="images/boton-css.jpg" style="margin-
left:10px; cursor: hand; cursor: pointer; border: 0px none;"
value="Ejemplo de Boton CSS">
Cambiar el color de fondo con CSS

      <html>
      <head>
      <style type="text/css">
      body {background-color: yellow}
      h1 {background-color: #00ff00}
      h2 {background-color: transparent}
      p {background-color: rgb(250,0,255)}
      </style>
      </head>
      <body>
      <h1>Este es el encabezado 1</h1>
      <h2>Este esel encabezado 2</h2>
      <p>Este es un párrafo.</p>
      </body>
      </html>
Cursor de Ayuda con CSS
           <a href="ayuda-CSS.htm"
           style="cursor:help;">Ayuda CSS</a>



  Botón con Rollover 1 en CSS
          #bot1 a{
          background-image:url(bg_menu_1.jpg);
          background-position: center top;
          height:30px;
          width:100px;
          display: block;
          color: #990000;
          text-decoration: none;
          padding-top: 5px;
          background-repeat: no-repeat;
          font-weight: bold;
          }
http://www.ejemplode.com/18-css/28-
ejemplo_de_boton_de_formulario_en_css.html

Más contenido relacionado

La actualidad más candente

Hojas de estilo cascada
Hojas de estilo cascadaHojas de estilo cascada
Hojas de estilo cascada
laura elizabeth ventura hernandez
 
Etiquetas básicas en html
Etiquetas básicas en htmlEtiquetas básicas en html
Etiquetas básicas en html
Andrés Quintero Macea
 
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
Alex Sánchez
 
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
Evelyncita Perea
 
Taller de Maquetación Web
Taller de Maquetación WebTaller de Maquetación Web
Taller de Maquetación Web
Bruno Garcia
 
Deber vero
Deber veroDeber vero
Deber vero
cristhianloor
 
Curso FPE Diseño Web. Módulo 4. CSS
Curso FPE Diseño Web. Módulo 4. CSSCurso FPE Diseño Web. Módulo 4. CSS
Curso FPE Diseño Web. Módulo 4. CSS
Diseñática disenatica.com
 
Conceptos Básicos CSS
Conceptos Básicos CSSConceptos Básicos CSS
Conceptos Básicos CSS
Patricio Mas
 
Deber de programacion web.
Deber de programacion web.Deber de programacion web.
Deber de programacion web.
hamintoperez
 
Ba trabajo de organigrama
Ba trabajo de organigramaBa trabajo de organigrama
Ba trabajo de organigrama
lanegritabella
 
Pres de po
Pres de poPres de po
Pres de po
romimaira
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
Miguel Zapata
 
Css Introducción
Css IntroducciónCss Introducción
Css Introducción
Universidad Intercontinental
 
Etiquetas head y body
Etiquetas head y bodyEtiquetas head y body
Etiquetas head y body
Sebastian De Los Angeles
 
Que es CSS? Presentacion Basica para CSS
Que es CSS? Presentacion Basica para CSSQue es CSS? Presentacion Basica para CSS
Que es CSS? Presentacion Basica para CSS
josuew2013
 
HTML Primeras etiquetas
HTML Primeras etiquetasHTML Primeras etiquetas
HTML Primeras etiquetas
Gabriela Pérez Caviglia
 

La actualidad más candente (17)

Hojas de estilo cascada
Hojas de estilo cascadaHojas de estilo cascada
Hojas de estilo cascada
 
Etiquetas básicas en html
Etiquetas básicas en htmlEtiquetas básicas en html
Etiquetas básicas en html
 
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
 
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
 
Taller de Maquetación Web
Taller de Maquetación WebTaller de Maquetación Web
Taller de Maquetación Web
 
Deber vero
Deber veroDeber vero
Deber vero
 
Curso FPE Diseño Web. Módulo 4. CSS
Curso FPE Diseño Web. Módulo 4. CSSCurso FPE Diseño Web. Módulo 4. CSS
Curso FPE Diseño Web. Módulo 4. CSS
 
Conceptos Básicos CSS
Conceptos Básicos CSSConceptos Básicos CSS
Conceptos Básicos CSS
 
Deber de programacion web.
Deber de programacion web.Deber de programacion web.
Deber de programacion web.
 
Ba trabajo de organigrama
Ba trabajo de organigramaBa trabajo de organigrama
Ba trabajo de organigrama
 
Pres de po
Pres de poPres de po
Pres de po
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
Etiquetas de html
Etiquetas de htmlEtiquetas de html
Etiquetas de html
 
Css Introducción
Css IntroducciónCss Introducción
Css Introducción
 
Etiquetas head y body
Etiquetas head y bodyEtiquetas head y body
Etiquetas head y body
 
Que es CSS? Presentacion Basica para CSS
Que es CSS? Presentacion Basica para CSSQue es CSS? Presentacion Basica para CSS
Que es CSS? Presentacion Basica para CSS
 
HTML Primeras etiquetas
HTML Primeras etiquetasHTML Primeras etiquetas
HTML Primeras etiquetas
 

Similar a Css

Maquetacion
MaquetacionMaquetacion
Maquetacion
iConstruye
 
Estilos cascadas
Estilos cascadasEstilos cascadas
Estilos cascadas
Mabeciita Ayala
 
Presenpabo
PresenpaboPresenpabo
Presenpabo
pabobdp
 
Manual de css......jpg
Manual de css......jpgManual de css......jpg
Manual de css......jpg
genesisgray
 
Manual de css hojas de estilo
Manual de css hojas de estiloManual de css hojas de estilo
Manual de css hojas de estilo
genesisgray
 
Hojas de estilo (css)
Hojas de estilo (css)Hojas de estilo (css)
Hojas de estilo (css)
Krolina Agui
 
Css básico
Css básicoCss básico
Guia de css para principiantes
Guia de css para principiantesGuia de css para principiantes
Guia de css para principiantes
Pedro Antonio Villalta (Pavillalta)
 
css
csscss
3.css
3.css3.css
Presentación
PresentaciónPresentación
Presentación
aynosk6
 
Manual de introducción a CSS3
Manual de introducción a CSS3Manual de introducción a CSS3
Manual de introducción a CSS3
Juan Alberto Ortega Contreras
 
Manual de Introducción a CSS3
Manual de Introducción a CSS3Manual de Introducción a CSS3
Manual de Introducción a CSS3
Juan Alberto Ortega Contreras
 
Presentación CSS y HTML en Gummurcia
Presentación CSS y HTML en GummurciaPresentación CSS y HTML en Gummurcia
Presentación CSS y HTML en Gummurcia
Manuel Villagordo Vera
 
Gordo
GordoGordo
Presentación
PresentaciónPresentación
Presentación
aynosk6
 
TAREA DEL CSS
TAREA DEL CSSTAREA DEL CSS
TAREA DEL CSS
romimaira
 
programacion
programacionprogramacion
programacion
Gordo Villa
 
Dhtml
DhtmlDhtml
Paginas web css
Paginas web cssPaginas web css
Paginas web css
axel lopez
 

Similar a Css (20)

Maquetacion
MaquetacionMaquetacion
Maquetacion
 
Estilos cascadas
Estilos cascadasEstilos cascadas
Estilos cascadas
 
Presenpabo
PresenpaboPresenpabo
Presenpabo
 
Manual de css......jpg
Manual de css......jpgManual de css......jpg
Manual de css......jpg
 
Manual de css hojas de estilo
Manual de css hojas de estiloManual de css hojas de estilo
Manual de css hojas de estilo
 
Hojas de estilo (css)
Hojas de estilo (css)Hojas de estilo (css)
Hojas de estilo (css)
 
Css básico
Css básicoCss básico
Css básico
 
Guia de css para principiantes
Guia de css para principiantesGuia de css para principiantes
Guia de css para principiantes
 
css
csscss
css
 
3.css
3.css3.css
3.css
 
Presentación
PresentaciónPresentación
Presentación
 
Manual de introducción a CSS3
Manual de introducción a CSS3Manual de introducción a CSS3
Manual de introducción a CSS3
 
Manual de Introducción a CSS3
Manual de Introducción a CSS3Manual de Introducción a CSS3
Manual de Introducción a CSS3
 
Presentación CSS y HTML en Gummurcia
Presentación CSS y HTML en GummurciaPresentación CSS y HTML en Gummurcia
Presentación CSS y HTML en Gummurcia
 
Gordo
GordoGordo
Gordo
 
Presentación
PresentaciónPresentación
Presentación
 
TAREA DEL CSS
TAREA DEL CSSTAREA DEL CSS
TAREA DEL CSS
 
programacion
programacionprogramacion
programacion
 
Dhtml
DhtmlDhtml
Dhtml
 
Paginas web css
Paginas web cssPaginas web css
Paginas web css
 

Css

  • 1.
  • 2.
  • 3. El nombre hojas de estilo en cascada viene del inglés Cascading Style Sheets, del que toma sus siglas. CSS es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML). El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores. La información de estilo puede ser adjuntada como un documento separado o en el mismo documento HTML. En este último caso podrían definirse estilos generales en la cabecera del documento o en cada etiqueta particular mediante el atributo "<style>"
  • 4.
  • 5. Por ejemplo, el elemento de HTML <h1> indica que un bloque de texto es un encabezamiento y que es más importante que un bloque etiquetado como <h2>. Versiones más antiguas de HTML permitían atributos extra dentro de la etiqueta abierta para darle formato (como el color o el tamaño de fuente). No obstante, cada etiqueta <h1> debía disponer de la información si se deseaba un diseño consistente para una página y, además, una persona que leía esa página con un navegador perdía totalmente el control sobre la visualización del texto. Cuando se utiliza CSS, la etiqueta <h1> no debería proporcionar información sobre cómo será visualizado, solamente marca la estructura del documento. La información de estilo, separada en una hoja de estilo, especifica cómo se ha de mostrar <h1>: color, fuente, alineación del texto, tamaño y otras características no visuales, como definir el volumen de un sintetizador de voz, por ejemplo. Por otro lado, antes de que estuviera disponible CSS, la única forma de componer espacialmente una página era el uso de tablas <table>.
  • 6.
  • 7. Borde en CSS <html> <head> <style type="text/css"> p { border: medium double rgb(250,0,255) } </style> </head> <body> <p>Texto rodeado por borde en CSS</p> </body> </html> Botón de Formulario en CSS <input type="image" src="images/boton-css.jpg" style="margin- left:10px; cursor: hand; cursor: pointer; border: 0px none;" value="Ejemplo de Boton CSS">
  • 8. Cambiar el color de fondo con CSS <html> <head> <style type="text/css"> body {background-color: yellow} h1 {background-color: #00ff00} h2 {background-color: transparent} p {background-color: rgb(250,0,255)} </style> </head> <body> <h1>Este es el encabezado 1</h1> <h2>Este esel encabezado 2</h2> <p>Este es un párrafo.</p> </body> </html>
  • 9. Cursor de Ayuda con CSS <a href="ayuda-CSS.htm" style="cursor:help;">Ayuda CSS</a> Botón con Rollover 1 en CSS #bot1 a{ background-image:url(bg_menu_1.jpg); background-position: center top; height:30px; width:100px; display: block; color: #990000; text-decoration: none; padding-top: 5px; background-repeat: no-repeat; font-weight: bold; } http://www.ejemplode.com/18-css/28- ejemplo_de_boton_de_formulario_en_css.html