Your SlideShare is downloading. ×
0
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Hojas de estilos css
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Hojas de estilos css

1,269

Published on

iniciación a las hojas de estilos

iniciación a las hojas de estilos

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,269
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. LENGUAJES WEB DEL CLIENTE Aplicaciones Web
  • 2. LENGUAJES DESDE EL CLIENTE •Lenguaje de Marcas HTML. •Hojas de Estilos CSS. •Lenguaje de Marcas XHTML. •JavaScript. rmonago 2 IES Augustóbriga – 2º SMR – Aplicaciones Web
  • 3. Página WebPágina Web Estructura Contenido Apariencia Comportamiento HTML CSS Javascript • Colores • Tipografías • Alineación • Efectos • Validaciones • Automatización • Párrafos • Encabezados • Listas •Tablas • Capas • Etc. • Textos • Imágenes • Enlaces • Fondos • Tamaños • Etc. rmonago 3 IES Augustóbriga – 2º SMR – Aplicaciones Web
  • 4. LENGUAJE CSS Al crear una página web, se utiliza en primer lugar el lenguaje HTML/XHTML para marcar los contenidos, es decir, para designar la función de cada elemento dentro de la página: párrafo, titular, texto destacado, tabla, lista de elementos, etc. Una vez creados los contenidos, se utiliza el lenguaje CSS para definir el aspecto de cada elemento: color, tamaño y tipo de letra del texto, separación horizontal y vertical entre elementos, posición de cada elemento dentro de la página, etc. rmonago 4 IES Augustóbriga – 2º SMR – Aplicaciones Web
  • 5. EN HTML : FORMATOS DE TEXTO <font color=“green” size="4" face="Comic Sans MS"> Ejemplo de texto en verde </font> Las propiedades del texto pueden modificarse a través de la etiqueta <font> . Para ello, podemos insertar el texto entre las etiquetas y , especificando algunos de los atributos de la etiqueta: FACE: fuente. nombre de la fuente, o fuentes COLOR: color del texto. número hexadecimal o texto predefinido SIZE: tamaño del texto. valores del 1 al 7, siendo por defecto el 3, o desplazamiento respecto al tamaño por defecto, añadiendo + o - delante del valor rmonago 5 IES Augustóbriga – 2º SMR – Aplicaciones Web
  • 6. EN HTML : FORMATOS DE TEXTO – EJEMPLO rmonago 6 IES Augustóbriga – 2º SMR – Aplicaciones Web
  • 7. EN CSS : FORMATOS DE TEXTO rmonago 7 IES Augustóbriga – 2º SMR – Aplicaciones Web La solución que propone CSS es mucho mejor, ejemplo: <html> <head> <title>Ejemplo de estilos con CSS</title> <style type="text/css"> h1 { color: red; font-family: Arial; font-size: large; } p { color: gray; font-family: Verdana; font-size: medium; } </style> </head> <body> <h1>Titular de la página</h1> <p>Un párrafo de texto no muy largo.</p> </body> </html>
  • 8. EJEMPLO CSS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 8
  • 9. CSS rmonago 9 IES Augustóbriga – 2º SMR – Aplicaciones Web CSS permite separar los contenidos de la página y la información sobre su aspecto. En el ejemplo anterior, dentro de la propia página HTML se crea una zona especial en la que se incluye toda la información relacionada con los estilos de la página. Utilizando CSS, se pueden establecer los mismos estilos con menos esfuerzo y sin ensuciar el código HTML de los contenidos con etiquetas <font>. Como se verá más adelante, la etiqueta <style> crea una zona especial donde se incluyen todas las reglas CSS que se aplican en la página. Definir los estilos de esta forma ahorra miles de etiquetas y millones de atributos respecto a la solución anterior. Pero parece que sigue sin ser una solución ideal: Como los estilos CSS sólo se aplican en la página que los incluye, ¿si queremos que las 100 páginas diferentes del sitio tengan el mismo aspecto, se deberían copiar 100 veces esas mismas reglas CSS?.
  • 10. CÓMO INCLUIR CSS rmonago 10 IES Augustóbriga – 2º SMR – Aplicaciones Web Una de las principales características de CSS es su flexibilidad y las diferentes opciones que ofrece para realizar una misma tarea. De hecho, existen tres opciones para incluir CSS en un documento HTML. •Incluir CSS en los elementos HTML •Incluir CSS en el mismo documento HTML •Definir CSS en un archivo externo
  • 11. INCLUIR CSS EN LOS ELEMENTOS HTML rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 11 El menos utilizado, ya que tiene los mismos problemas que la utilización de las etiquetas <font>. Esta forma de incluir CSS directamente en los elementos HTML solamente se utiliza en determinadas situaciones en las que se debe incluir un estilo muy específico para un solo elemento concreto. <body> <p style="color: black; font-family: Verdana;">Un párrafo de texto.</p> </body>
  • 12. INCLUIR CSS EN EL MISMO DOCUMENTO HTML rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 12 Los estilos se definen en una zona específica del propio documento HTML. Se emplea la etiqueta <style> de HTML y solamente se pueden incluir en la cabecera del documento. <html> <head> <title>Estilos CSS en el propio documento</title> <style type="text/css"> p { color: black; font-family: Verdana; } </style> </head> <body> <p>Un p&aacute;rrafo de texto.</p> </body> </html>
  • 13. DEFINIR CSS EN UN ARCHIVO EXTERNO rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 13 Los estilos CSS se incluyen en un archivo de tipo CSS que las páginas HTML enlazan mediante la etiqueta <link>. El archivo CSS es un archivo simple de texto cuya extensión es .css Se pueden crear todos los archivos CSS que sean necesarios y cada página HTML puede enlazar tantos archivos CSS como necesite. Para ello, se deben seguir los siguientes pasos: 1) Se crea el archivo css y se le añade el siguiente contenido: p { color: black; font-family: Verdana; } 2) Se guarda el archivo de texto con el nombre estilos.css y no .txt 3) En la página HTML se enlaza el archivo CSS externo mediante la etiqueta <link>
  • 14. DEFINIR CSS EN UN ARCHIVO EXTERNO rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 14 <html> <head> <title>Ejemplo de estilos CSS en un archivo externo</title> <link rel="stylesheet" type="text/css" href="/css/estilos.css“ media="screen" /> </head> <body> <p>Un párrafo de texto.</p> </body> </html> Cuando el navegador carga la página HTML anterior, antes de mostrar sus contenidos también descarga los archivos CSS externos enlazados mediante la etiqueta <link> y aplica los estilos a los contenidos de la página.
  • 15. <LINK> rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 15 La etiqueta <link> incluye cuatro atributos para enlaza un archivo CSS: • rel: indica el tipo de relación que existe entre el recurso enlazado (en este caso, el archivo CSS) y la página HTML. Para los archivos CSS, siempre se utiliza el valor stylesheet • type: indica el tipo de recurso enlazado. Sus valores están estandarizados y para los archivos CSS su valor siempre es text/css • href: indica la URL del archivo CSS que contiene los estilos. La URL indicada puede ser relativa o absoluta y puede apuntar a un recurso interno o externo al sitio web. • media: indica el medio en el que se van a aplicar los estilos del archivo CSS. Más adelante se explican en detalle los medios CSS y su funcionamiento.
  • 16. DEFINIR CSS EN UN ARCHIVO EXTERNO rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 16 Aunque generalmente se emplea la etiqueta <link> para enlazar los archivos CSS externos, también se puede utilizar la etiqueta <style>. La forma alternativa de incluir un archivo CSS externo se muestra a continuación: … <head> <title>Ejemplo de estilos CSS en un archivo externo</title> <style type="text/css" media="screen"> @import '/css/estilos.css'; </style> </head> … En este caso, para incluir en la página HTML los estilos definidos en archivos CSS externos se utiliza una regla especial de tipo @import. Las reglas de tipo @import siempre preceden a cualquier otra regla CSS
  • 17. REGLAS CSS rmonago 17 IES Augustóbriga – 2º SMR – Aplicaciones Web • Regla: cada uno de los estilos que componen una hoja de estilos Cada regla está compuesta de una parte de "selectores", el símbolo de llave de apertura { , otra parte denominada "declaración" y por último, el símbolo llave de cierre }. • Selector: indica el elemento/os HTML a los que se aplica la regla CSS. • Declaración: especifica los estilos que se aplican a los elementos. Está compuesta por una o más propiedades CSS. • Propiedad: característica que se modifica en el elemento, ejemplo : color • Valor: establece el nuevo valor de la característica modificada en el elemento.
  • 18. MEDIOS CCS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 18 Una de las características más importantes de las hojas de estilos CSS es que permiten definir diferentes estilos para diferentes medios o dispositivos: pantallas, impresoras, móviles, proyectores, etc. @media print { body { font-size: 10pt } } @media screen { body { font-size: 13px } } <link rel="stylesheet" type="text/css" media="screen" href="basico.css" /> <link rel="stylesheet" type="text/css" media="print" href="especial.css" />
  • 19. SELECTORES BÁSICOS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 19 • Universal • Tipos o etiquetas • Descencientes • De clases • De ID • Combinación de selectores
  • 20. SELECTOR UNIVERSAL rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 20 El selector universal se indica mediante un asterisco (*). A pesar de su sencillez, no se utiliza habitualmente, ya que es difícil que un mismo estilo se pueda aplicar a todos los elementos de una página.
  • 21. SELECTOR DE TIPOS O ETIQUETAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 21 Para utilizar este selector, solamente es necesario indicar el nombre de una etiqueta HTML (sin los caracteres < y >) correspondiente a los elementos que se quieren seleccionar. h1 { color: red; } CSS permite agrupar reglas individuales en una sola regla con un selector múltiple. Para ello, se incluyen todos los selectores separados por una coma (,) h1, h2, h3 { color: #8A8E27; font-weight: normal; font-family: Arial, Helvetica, sans-serif; } También es habitual agrupar las propiedades comunes de varios elementos en una única regla CSS y posteriormente definir las propiedades específicas de esos mismos elementos.
  • 22. SELECTOR DESCENCIENTES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 22 Un elemento es descendiente de otro cuando se encuentra entre las etiquetas de apertura y de cierre del otro elemento. <p> ... <span>texto1</span> ... <a href="">...<span>texto2</span></a> ... </p> El selector p span selecciona tanto texto1 como texto2.Al resto de elementos <span> de la página que no están dentro de un elemento <p>, no se les aplica la regla CSS anterior.
  • 23. SELECTOR DESCENCIENTES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 23 p a span em { text-decoration: underline; } Los estilos de la regla anterior se aplican a los elementos de tipo <em> que se encuentren dentro de elementos de tipo <span>, que a su vez se encuentren dentro de elementos de tipo <a> que se encuentren dentro de elementos de tipo <p>. No debe confundirse el selector descendiente con la combinación de selectores p, a, span, em { text-decoration: underline; }
  • 24. SELECTOR DE CLASES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 24 ¿Cómo se pueden aplicar estilos CSS sólo al primer párrafo? Creamos una nueva regla llamada destacado <p> Texto de párrafo </p> <p class="destacado">Ejemplo párrafo distinto al resto </p> <p> Texto de párrafo </p> .destacado { color: red; } El selector .destacado se interpreta como "cualquier elemento de la página cuyo atributo class sea igual a destacado", por lo que solamente el segundo párrafo cumple esa condición.
  • 25. SELECTOR DE CLASES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 25 Es posible aplicar los estilos de varias clases CSS sobre un mismo elemento. .error { color: red; } .destacado { font-size: 15px; } .especial { font-weight: bold; } <p class="especial destacado error">Párrafo de texto...</p>
  • 26. SELECTOR DE ID rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 26 El selector de ID permite seleccionar un elemento de la página a través del valor de su atributo id. Este tipo de selectores sólo seleccionan un elemento de la página porque el valor del atributo id no se puede repetir en dos elementos diferentes de una misma página. La sintaxis de los selectores de ID es muy parecida a la de los selectores de clase, salvo que se utiliza el símbolo de la almohadilla (#) en vez del punto (.) como prefijo del nombre de la regla CSS #destacado { color: red; } <p>Primer párrafo</p> <p id="destacado">Segundo párrafo</p> <p>Tercer párrafo</p>
  • 27. MÁS SELECTORES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 27 Selector de hijos Selector adyacente p > span { color: blue; } <p><span>Texto1</span></p> <p><a href="#"><span>Texto2</span></a></p> h1 + h2 { color: red } <body> <h1>Titulo1</h1> <h2>Subtítulo</h2> ... <h2>Otro subtítulo</h2>
  • 28. MÁS SELECTORES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 28 Selector de atributos Tipos de selectores de atributos son: •[nombre_atributo], selecciona los elementos que tienen establecido el atributo llamado nombre_atributo, independientemente de su valor. •[nombre_atributo=valor], selecciona los elementos que tienen establecido un atributo llamado nombre_atributo con un valor igual a valor. •[nombre_atributo~=valor], selecciona los elementos que tienen establecido un atributo llamado nombre_atributo y al menos uno de los valores del atributo es valor. •[nombre_atributo|=valor], selecciona los elementos que tienen establecido un atributo llamado nombre_atributo y cuyo valor es una serie de palabras separadas con guiones, pero que comienza con valor.
  • 29. SELECTOR DE ATRIBUTOS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 29 Se muestran azul todos los enlaces que tengan un atributo "class", independientemente de su valor a[class] { color: blue; } Se muestran azul todos los enlaces que tengan un atributo "class" con el valor "externo" a[class="externo"] { color: blue; } Se muestran de color azul todos los enlaces que apunten al sitio "http://www.ejemplo.com" a[href="http://www.ejemplo.com"] { color: blue; } Se muestran de color azul todos los enlaces que tengan un atributo "class" en el que al menos uno de sus valores sea "externo" a[class~="externo"] { color: blue; } Selecciona todos los elementos de la página cuyo atributo "lang" sea igual a "en", es decir, todos los elementos en inglés *[lang=en] { ... } Selecciona todos los elementos de la página cuyo atributo "lang" empiece por "es", es decir, "es", "es-ES", "es-AR", etc. *[lang|="es"] { color : red }
  • 30. UNIDADES DE MEDIDA rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 30 Unidades relativas La unidades relativas son más flexibles que las unidades absolutas porque se adaptan más fácilmente a los diferentes medios. A continuación se muestra la lista de unidades de medida relativas y la referencia que se toma para determinar su valor real: • em, (no confundir con la etiqueta <em> de HTML) relativa respecto del tamaño de letra empleado. Aunque no es una definición exacta, el valor de 1em se puede aproximar por la anchura de la letra M ("eme mayúscula") del tipo y tamaño de letra que se esté utilizando • ex, relativa respecto de la altura de la letra x ("equis minúscula") del tipo y tamaño de letra que se esté utilizando • px, (píxel) relativa respecto de la resolución de la pantalla del usuario body { font-size: .9em; }
  • 31. UNIDADES DE MEDIDA rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 31 Unidades absolutas Las unidades absolutas definen las medidas de forma completa, ya que sus valores reales no se calculan a partir de otro valor de referencia, sino que son directamente los valores indicados. A continuación se muestra la lista completa de unidades absolutas definidas por CSS y su significado: • in, del inglés "inches", pulgadas (1 pulgada son 2.54 centímetros) • cm, centímetros • mm, milímetros • pt, puntos (1 punto equivale a 1 pulgada/72, es decir, unos 0.35 milímetros) • pc, picas (1 pica equivale a 12 puntos, es decir, unos 4.23 milímetros) a { font-size: 12pt }
  • 32. UNIDADES DE MEDIDA rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 32 Porcentajes CSS define otra unidad de medida relativa basada en los porcentajes. Un porcentaje está formado por un valor numérico seguido del símbolo % y siempre está referenciado a otra medida. body { font-size: 1em; } h1 { font-size: 200%; }
  • 33. UNIDADES DE COLOR rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 33 Los colores en CSS se pueden indicar de cinco formas diferentes: palabras clave, colores del sistema, RGB hexadecimal, RGB numérico y RGB porcentual.
  • 34. MODELO DE CAJAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 34 El modelo de cajas es la característica más importante del lenguaje de hojas de estilos CSS, ya que condiciona el diseño de todas las páginas web. El modelo de cajas es el comportamiento de CSS que hace que todos los elementos de las páginas se representen mediante cajas rectangulares. Las cajas de una página se crean automáticamente. Cada vez que se inserta una etiqueta HTML, se crea una nueva caja rectangular que encierra los contenidos de ese elemento. La siguiente imagen muestra las tres cajas rectangulares que crean las tres etiquetas HTML que incluye la página:
  • 35. MODELO DE CAJAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 35
  • 36. MODELO DE CAJAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 36 Las partes que componen cada caja y su orden de visualización desde el punto de vista del usuario son las siguientes: • Contenido (content): se trata del contenido HTML del elemento (las palabras de un párrafo, una imagen, el texto de una lista de elementos, etc.) • Relleno (padding): espacio libre opcional existente entre el contenido y el borde. • Borde (border): línea que encierra completamente el contenido y su relleno. • Imagen de fondo (background image): imagen que se muestra por detrás del contenido y el espacio de relleno. • Color de fondo (background color): color que se muestra por detrás del contenido y el espacio de relleno. • Margen (margin): separación opcional existente entre la caja y el resto de cajas adyacentes.
  • 37. Margin-left Margin-right Margin-top Margin-bottom Unidades CSS margin-left: 1cm; margin-left: 0,5in; Indicamos con este atributo el tamaño del margen a la izquierda, … Padding-left Padding-right Padding-top Padding-bottom Unidades CSS padding-left: 0.5in; padding-left: 1px; Indica el espacio insertado, por la izq.., entre el borde del elemento-continente y el contenido. Border-color color RGB y nombre de color border-color: red; border-color: #ffccff; Para indicar el color del borde del elemento de la página al que se lo aplicamos. Por separado con los atributos border-top-color, border-right-color, border-bottom-color,… Border-style none | dotted | solid | double | groove | ridge | inset | outset border-style: solid; border-style: double; El estilo del borde, los valores significan: none=ningun borde, dotted=punteado (no parece funcionar), solid=solido, double=doble borde, y el resto estilos 3D. border-width Unidades CSS border-width: 10px; border-width: 0.5in; El tamaño del borde del elemento al que lo aplicamos. float none | left | right float: right; Sirve para alinear un elemento haciendo que el texto se agrupe alrededor. clear none | right | left clear: right; CAJAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 37
  • 38. TEXTOS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 38 text-indent Desplazamiento de la primera línea del texto [ <longitud> | <porcentaje> ] text-align Alineamiento del texto [ left | right | center | justify ] text-decoration Efectos de subrayado, tachado, parpadeo [ none | [ underline || overline || line-through || blink ] ] letter-spacing Espacio entre caracteres [ normal | <longitud> ] word-spacing Espacio entre palabras [ normal | <longitud> ] text-transform Transformaciones del texto a mayúsculas/minúsculas [ capitalize | uppercase | lowercase | none ] white-space Comportamiento de los espacios dentro de los elementos [ normal | pre | nowrap | pre-wrap | pre-line ]
  • 39. font-family Familias de fuentes [ [ <nombre-familia> | <familia-genérica> ] [, <nombre-familia> | <familia-genérica> ]* ] font-style Estilo de la fuente [ normal | italic | oblique ] font-variant Convierte las minúsculas a mayúsculas pero mantienen un tamaño inferior a las mayúsculas [ normal | small-caps ] font-weight Intensidad de la fuente [ normal | bold | bolder | lighter | 100 |400 ] font-size Tamaño de la fuente [ [ xx-small | x-small | small | medium | large | x-large | xx-large] | [larger | smaller] | <longitud> | <porcentaje> ] font Atajo para establecer el resto de propiedades sobre las fuentes a la vez [ [ [ <font-style> || <font-variant> || <font- weight> ]? <font-size> [ / <line-height> ]? <font-family> ] | caption | icon | menu | message-box | small-caption | status-bar ] FUENTES rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 39
  • 40. TABLAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 40 caption-side Posición del título de respecto la tabla [ top | bottom ] caption-side Posición del título de respecto la tabla [ top | bottom ] caption-side Posición del título de respecto la tabla [ top | bottom ] caption-side Posición del título de respecto la tabla [ top | bottom ] caption-side Posición del título de respecto la tabla [ top | bottom ]
  • 41. CAPAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 41 display Comportamiento del contenedor position Esquema de posicionamiento [ static | relative | absolute | fixed ] top right bottom left Desplazamiento de la caja (respecto al límite superior, derecho, inferior o izquierdo del contenedor) [ <longitud> | <porcentaje> | auto ] float Posicionamiento flotante [ left | right | none ] clear Control de cajas adyacentes a los float [ none | left | right | both ] z-index Solapamiento de niveles de capas [ auto | <entero_con_signo> ] direction Sentido direccional de la escritura [ ltr | rtl ] unicode-bidi Sentido direccional de la escritura [ normal | embed | bidi- override ]
  • 42. CAPAS rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 42 width Ancho [ <longitud> | <porcentaje> | auto ] min-width Ancho mínimo [ <longitud> | <porcentaje> ] max-width Ancho máximo [ <longitud> | <porcentaje> | none ] height Alto [ <longitud> | <porcentaje> | auto ] min-height Alto mínimo [ <longitud> | <porcentaje> ] max-height Alto máximo [ <longitud> | <porcentaje> | none ] line-height Altura entre las bases del texto [ normal | <número> | <longitud> | <porcentaje> ] vertical-align Alineación vertical del texto [ baseline | sub | super | top | text- top | middle | bottom | text-bottom | <porcentaje> | <longitud> ]
  • 43. rmonagoIES Augustóbriga – 2º SMR – Aplicaciones Web 43 http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

×