Você está na página 1de 18

Funciones del html5

Todos los elementos del estndar HTML5 estn listados aqu, descritos por su etiqueta de
apertura y agrupados por su funcin. Contrariamente al ndice el cual lista todas las posibles
etiquetas, estndar, no-estndar, vlidas, obsoletas o aquellas en desuso, esta lista solamente
los elementos vlidos de HTML5. Solamente aquellos elementos listados aqu son los que
deberan ser usados en nuevos sitios Web.

Elemento raz
Elemento

Descripcin

<html>

Representa la raz de un documento HTML o XHTML. Todos los dems


elementos deben ser descendientes de este elemento.

Metadatos del documento


Elemento

Descripcin

<head>

Representa una coleccin de metadatos acerca del documento,


incluyendo enlaces a, o definiciones de, scripts y hojas de estilo.

<title>

Define el ttulo del documento, el cual se muestra en la barra de


ttulo del navegador o en las pestaas de pgina. Solamente
puede contener texto y cualquier otra etiqueta contenida no ser
interpretada.

<base>

Define la URL base para las URLs relativas en la pgina.

<link>

Usada para enlazar JavaScript y CSS externos con el documento


HTML actual.

<meta>

Define los metadatos que no pueden ser definidos usando otro


elemento HTML.

<style>

Etiqueta de estilo usada para escribir CSS en lnea.

Scripting
Element
o

Descripcin

<script>

Define ya sea un script interno o un enlace hacia un script


externo. El lenguaje de programacin es JavaScript

<noscript
>

Define un contenido alternativo a mostrar cuando el navegador no


soporta scripting.

Secciones
Elemento

Descripcin

<body>

Representa el contenido principal de un


documento HTML. Solo hay un
elemento <body> en un documento.

<section> 5

Define una seccin en un documento.

<nav> 5

Define una seccin que solamente contiene


enlaces de navegacin

<article> 5

Define contenido autnomo que podra existir


independientemente del resto del contenido.

<aside> 5

Define algunos contenidos vagamente


relacionados con el resto del contenido de la
pgina. Si es removido, el contenido restante
seguir teniendo sentido

Los elemento de cabecera implementan seis


niveles de cabeceras de documentos; <h1> es
<h1>,<h2>,<h3>,<h4>,<h5>
la de mayor y <h6> es la de menor impotancia.
,<h6>
Un elemento de cabecera describe brevemente
el tema de la seccin que introduce.

<header> 5

Define la cabecera de una pgina o seccin.


Usualmente contiene un logotipo, el ttulo del
sitio Web y una tabla de navegacin de
contenidos.

<footer> 5

Define el pie de una pgina o seccin.


Usualmente contiene un mensaje de derechos
de autora, algunos enlaces a informacin legal
o direcciones para dar informacin de
retroalimentacin.

<address>

Define una seccin que contiene informacin


de contacto.

<main>5

Define el contenido principal o importante en el


documento. Solamente existe un
elemento <main> en el documento.

Agrupacin de Contenido

Elemento

Descripcin

<p>

Define una parte que debe mostrarse como un prrafo.

<hr>

Representa un quiebre temtico entre parrafos de una seccin


o articulo o cualquier contenido.

<pre>

Indica que su contenido esta preformateado y que este


formato debe ser preservado.

<blockquote>

Representa una contenido citado desde otra fuente.

<ol>

Define una lista ordenada de artculos.

<ul>

Define una lista de artculos sin orden.

<li>

Define un artculo de una lista ennumerada.

<dl>

Define una lista de definiciones, es decir, una lista de trminos


y sus definiciones asociadas.

<dt>

Representa un trmino definido por el siguiente <dd>.

<dd>

Representa la definicin de los terminos listados antes que l.

<figure> 5

Representa una figura ilustrada como parte del documento.

<figcaption>

5
<div>

Representa la leyenda de una figura.


Representa un contenedor genrico sin ningn significado
especial.

Semntica a nivel de Texto


Element
o

Descripcin

<a>

Representa un hiperenlace , enlazando a otro recurso.

<em>

Representa un texto enfatizado , como un acento de intensidad.

<strong>

Representa un texto especialmente importante .

<small>

Representa un comentario aparte , es decir, textos como un


descargo de responsabilidad o una nota de derechos de autora,
que no son esenciales para la comprensin del documento.

<s>

Representa contenido que ya no es exacto o relevante .

<cite>

Representa el ttulo de una obra .

<q>

Representa una cita textual inline.

Element
o

Descripcin

<dfn>

Representa un trmino cuya definicin est contenida en su


contenido ancestro ms prximo.

<abbr>

Representa una abreviacin o un acrnimo ; la expansin de la


abreviatura puede ser representada por el atributo title.

<data> 5

Asocia un equivalente legible por mquina a sus contenidos.


(Este elemento est slamente en la versin de la WHATWG del
estandar HTML, y no en la versin de la W3C de HTML5).

<time> 5

Representa un valor de fecha y hora; el equivalente legible por


mquina puede ser representado en el atributo datetime.

<code>

Representa un cdigo de ordenador .

<var>

Representa a una variable, es decir, una expresin matemtica o


contexto de programacin, un identificador que represente a una
constante, un smbolo que identifica una cantidad fsica, un
parmetro de una funcin o un marcador de posicin en prosa .

<samp>

Representa la salida de un programa o un ordenador.

<kbd>

Representa la entrada de usuario o usuaria, por lo general desde


un teclado, pero no necesariamente, este puede representar
otras formas de entrada de usuario o usuaria, como comandos de
voz transcritos.

<sub>,<s
up>

Representan un subndice y un superndice, respectivamente.

<i>

Representa un texto en una voz o estado de nimo alterno, o por


lo menos de diferente calidad, como una designacin
taxonmica, un trmino tcnico, una frase idiomtica, un
pensamiento o el nombre de un barco.

<b>

Representa un texto hacia el cual se llama la atencin


para propsitos utilitaros. No confiere ninguna importancia
adicional y no implica una voz alterna.

<u>

Representa una anotacin no textual sin-articular, como etiquetar


un texto como mal escrito o etiquetar un nombre propio en texto
en Chino.

<mark> 5

Representa texto resaltado con propsitos de referencia, es decir


por su relevancia en otro contexto.

<ruby> 5

Representa contenidos a ser marcados con anotaciones ruby,


recorridos cortos de texto presentados junto al texto. Estos son
utilizados con regularidad en conjunto a lenguajes de Asia del

Element
o

Descripcin
Este, donde las anotaciones actan como una gua para la
pronunciacin, como el furigana Japons.

<rt> 5

Representa el texto de una anotacin ruby .

<rp> 5

Representa los parntesis alrededor de una anotacin ruby,


usada para mostrar la anotacin de manera alterna por los
navegadores que no soporten despliegue estandar para las
anotaciones.

<bdi> 5

Representa un texto que debe ser aislado de sus alrededores


para el formateado bidireccional del texto. Permite incrustar un
fragmento de texto con una direccionalidad diferente o
desconocida.

<bdo>

Representa la direccionalidad de sus descendientes con el fin de


anular de forma explcita al algoritmo bidireccional Unicode.

<span>

Representa texto sin un significado especfico. Este debe ser


usado cuando ningn otro elemento semntico le confiere un
significado adecuado, en cuyo caso, provendr de atributos
globales como class, lang, o dir.

<br>

Representa un salto de lnea.

<wbr> 5

Representa una oportunidad de salto de lnea, es decir, un punto


sugerido de envoltura donde el texto de mltiples lneas puede
ser dividido para mejorar su legibilidad.

Ediciones
Elemento

Descripcin

<ins>

Define una adicin en el documento.

<del>

Define una remocin del documento.

Contenido incrustado
Elemen
to

Descripcin

<img>

Representa una imagen.

<iframe>

Representa un contexto anidado de navegacin, es decir, un


documento HTML embebido.

<embed> Representa un punto de integracin para una aplicacin o

contenido interactivo externo que por lo general no es HTML.

<object>

Representa un recurso externo, que ser tratado como una

Elemen
to

Descripcin
imagen, un sub-documento HTML o un recurso externo a ser
procesado por un plugin.

<param>
<video>

5
<audio>

5
<source>

5
<track>

5
<canvas>

Define parmetros para el uso por los plugins invocados por los
elementos <object>.
Representa un video , y sus archivos de audio y capciones
asociadas, con la interfaz necesaria para reproducirlos.
Representa un sonido o stream de audio.
Permite a autores o autoras especificar recursos multimedia
alternativos para los elementos multimedia como
<video> o <audio>.
Permite a autores o autoras especificar una pista de
texto temporizado para elementos multimedia
como <video> o <audio>.
Representa un rea de mapa de bits en el que se pueden utilizar
scripts para rende rizar grficos como grficas, grficas de juegos
o cualquier imagen visual al vuelo.

<map>

En conjunto con <area>, define un mapa de imagen.

<area>

En conjunto con <map>, define un mapa de imagen.

<svg> 5

Define una imagen vectorial embebida.

<math>

Define una frmula matemtica.

Datos tabulares
Element
o

Descripcin

<table>

Representa datos con ms de una dimensin.

<caption>

Representa el ttulo de una tabla.

<colgroup
>

Representa un conjunto de una o ms columnas de una tabla.

<col>

Representa una columna de una tabla.

<tbody>

Representa el bloque de filas que describen los datos


contretos de una tabla.

<thead>

Representa el bloque de filas que describen las etiquetas de

Element
o

Descripcin
columna de una tabla.

<tfoot>

Representa los bloques de filas que describen los resmenes de


columna de una tabla.

<tr>

Representa una fila de celdas en una tabla.

<td>

Representa una celda de datos en una tabla.

<th>

Representa una celda encabezado en una tabla.

Formularios
Elemento

Descripcin

<form>

Representa un formulario, consistendo de controles que puede


ser enviado a un servidor para procesamiento.

<fieldset>

Representa un conjunto de controles.

<legend>

Representa el ttulo de un <fieldset>.

<label>

Representa el ttulo de un control de formulario.

<input>

Representa un campo de datos escrito que permite al usuario o


usuaria editar los datos.

<button>

Representa un botn .

<select>

Represents un control que permite la seleccin entre un


conjunto de opciones.

Representa un conjunto de opciones predefiniddas para otros


controles.

<optgroup>

Representa un conjunto de opciones, agrupadas lgicamente.

<option>

Representa una opcin en un elemento <select>, o una


sugerencia de un elemento <datalist>.

<textarea>

Representa un control de edicin de texto multi-lnea.

<datalist>

<keygen>

5
<output> 5
<progress>

5
<meter> 5

Representa un control de par generador de llaves.


Representa el resultado de un clculo.
Representa el progreso de finalizacin de una tarea.
Representa la medida escalar (o el valor fraccionario) dentro de

Elemento

Descripcin
un rango conocido.

Elementos interactivos
Element
o

Descripcin

Representa un widget desde el que un usuario o usuaria puede


obtener informacin o controles adicionales.

<summary
>5

Representa un resumen, ttulo o leyenda para un


elemento <details> dado.

<comman
d> 5

Representa un comando que un usuario o usuaria puede invocar.

<menu> 5

Representa una lista de comandos.

<details>

Formatos de html5
Formatos de audio y video
Las etiquetas <audio> y <video> proporcionan apoyo para la reproduccin de audio y
video sin necesidad de plug-ins. Codecs de vdeo y codecs de audio se utilizan para
manejar vdeo y audio, y los diferentes codecs ofrecen diferentes niveles de compresin y
calidad. Un formato de contenedores utiliza para almacenar y transmitir el vdeo y el
audio codificado juntos. Muchos codecs y formatos de contenedor existe, e incluso hay ms
combinaciones de ellos. Para su uso en la web, slo un puado de combinaciones son
relevantes.
Diferentes navegadores no soportan los mismos formatos para audio y video en HTML5,
principalmente debido a problemas de patentes. El rea de formatos de medios en la web ha
sufrido mucho por la ley de patentes en muchos pases, incluyendo EE.UU y la UE (La
memoria de las patentes en este artculo se proporciona tal cual y sin ningn tipo de garanta.)
Para hacer un vdeo de HTML5, que trabaja en las nuevas versiones de los principales
navegadores, puede usar el elemento <source> para reproducir en formatos WebM o el
formato AAC MPEG H.264, usando el elemento de origen de esta manera: El

El formato WebM, especficamente el cdec de vdeo VP8, habra sido acusado de infraccin
de derechos de patente por un grupo de empresas deresponder a una llamada por
la MPEG LA para la formacin de un consorcio de patentes, pero MPEG LA se ha

comprometido a licenciar las patentes de Google bajo "transferible y de licencia gratuita". Esto
significa, efectivamente, que todas las patentes conocidas en el formato WebMtienen
licencia para todo el mundo de forma gratuita.
Gecko reconoce los siguientes tipos MIME para los archivos WebM:
video/webm
Un archivo WebM que es capaz de reproducir video (y es posible audio tambin)
audio/webm

Un archivo WebM que contiene audio unicamente.

Ogg Theora Vorbis


El formato contenedor Ogg con el cdec de vdeo Theora y el cdec de audio Vorbis es
compatible con Gecko (Firefox), Chrome y Opera, y el soporte para el formato se puede
agregar a Safari mediante la instalacin de un add-on. El formato no es compatible en
Internet Explorer.
WebM es preferente, generalmente sobre Theora Ogg Vorbis cuando est disponible, ya que
proporciona una mejor relacin de compresin para la calidad y se apoya en ms
navegadores. El formato Ogg sin embargo, puede ser utilizado para apoyar versiones de los
navegadores ms antiguos, en los que an no se dispone de soporte para WebM.
La situacin de las patentes de Theora es similar a la de WebM.
Usted puede aprender ms sobre la creacin de medios Ogg leyendo the Theora Cookbook.
Gecko reconoce los siguientes tipos de MIME para el archivo Ogg:
audio/ogg

Un archivo Ogg que contiene slo audio.


video/ogg

Un video que contiene el archivo ogg (y posiblemente audio tambin).


application/ogg

Un archivo Ogg con el contenido especificado. Utilizando uno de los otros dos
tipos MIME es preferido, pero se puede usar esta opcin si usted no sabe lo que el
contenido del fichero es.

ESTRUCTURA DE HTML 5

En HTML5 la estructura interna bsica de una pgina web se ha simplificado, reduciendo


el cdigo innecesario hasta quedarse con el esqueleto bsico, que sera el siguiente:

<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Ttulo de la web</title>
</head>
<body>
Contenido de la web
</body>
</html>

CSS3
6 nuevas funciones de CSS3 que ya pueden implementarse
Cada cierto tiempo van saliendo nuevas propiedades CSS3, todas ellas muy tiles y
sencillas, pero no todas son completamente soportadas por la mayora de los
navegadores.
Hoy nos vamos a centrar en una lista de novedades para CSS3 que s pueden ser usadas
hoy, debido a su gran compatibilidad con los navegadores:
1. TRANSPARENCIA
Ya sabas que existe la forma clsica de aplicar transparencias
.opacidad{
filter:alpha(opacity=50);/* para Internet Explorer */
-moz-opacity:0.5;
/* para Firefox, Netscape, Mozilla */
-khtml-opacity:0.5; /* para Khtml, version anterior de Safari */
opacity:0.5;
/* para Opera, Safari, Google Chrome */
}
Ahora, con CSS3 todo esto es ms sencillo y estandar, y se puede especificar un doble
background para aplicar transparencia a una caja de texto. Uno nos servir para definir el
color. El otro, para aplicar la transparencia, aadiendo un nuevo valor, que puede estar
entre el 0 (transparente) y 1 (opaco).

rgba(0-255,0-255,0-255,0-1)
Para distintos navegadores, se puede incluir un simple RGB o color hex en la
transparencia:
.estilo {
color: rgb(235,235,235);
color: <strong>rgba</strong>(255,255,255,0.75);
background-color: rgb(153,153,153);
background-color: <strong>rgba</strong>(0,0,0,0.5);
border-color: rgb(235,235,235);
border-color: <strong>rgba</strong>(255,255,255,0.65);
}
(Este hack es vlido para Safari 4, Firefox 3.0.5 en adelante y Chrome 1)
2. BORDES REDONDEADOS
Muy simple, utilizando la sintaxis compatible entre varios navegadores.
.redondeado {
border.radius: 10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
Y el HTML podra ser el siguiente
<div class="redondeado">
<a title="borde" href="#">borde</a> redondeado
</div>
3. TEXTO SOMBREADO
La propiedad text-shadow permite crear sombra sobre el texto, pudiendo variar las
posiciones de esta y el color de la sombra. Es muy til para encabezados y ttulos que

deseen resaltarse, pero no se debe abusar de ella porque puede saturar la vista del
usuario y crear una mala esttica.
Solo navegadores basados en Webkit, como Safari, Firefox 3.5+, Konqueror u Opera
pueden interpretar la propiedad text-shadow. Los otros navegadores no la soportan.
Ejemplo:
h1.test {
text-shadow: #6374AB 20px -12px 2px;
}
Los parmetros que se le dan son:
El color (#6374AB), la coordenada X de la sombra relativa al texto (20 pixeles), la
coordenada Y de la sombra relativa al texto (-12 pixeles), y la dispersin u opacidad que
tendr la sombra (2 pixeles). Si aumentamos mucho el ltimo valor, la sombra ser
ilegible.
4. SOMBREADO EN CAJAS DE TEXTO
Aadir sombra una caja de texto sigue el mismo formato que vimos en el punto anterior,
para agregar sombra en el texto. Para esto se utiliza la propiedad Box-shadow, que es
compatible con Safari 4, Firefox 3 y Chrome. Ejemplo:
.bordecaja {
-webkit-box-shadow: 0 0 10px rgb(0,0,0);
-moz-box-shadow: 0 0 10px rgb(0,0,0);
box-shadow: 0 0 10px rgb(0,0,0);
}
Se puede aadir mltiples sombras incluyendo mltiples valores separados por espacios:
.bordecaja {
-webkit-box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45), 15px -20px
20px rgba(255,0,0,.75);
-moz-box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45), 15px -20px
20px rgba(255,0,0,.75);

box-shadow: 0 0 20px rgb(0,255,0), -10px 5px 4px rgba(0,0,255,.45), 15px -20px 20px
rgba(255,0,0,.75);
}
Con esto ya tendremos nuestra propia sombra en la caja de texto, sin usar ningn tipo de
imgenes.
5. MULTIPLES FONDOS
Con CSS2 solo podamos tener una imagen de fondo por cada elemento. Pero ahora con
CSS3 podemos aplicar varias imgenes de fondo en un mismo elemento. Para ello
debemos aplicar este cdigo:
.variosfondos {
background: url(fondo1.gif) top left no-repeat,
url(fondo2.jpg) top 11px no-repeat,
url(fondo3.gif) bottom left no-repeat,
url(fondo4.gif) left repeat-y;
}
Es una nica propiedad background pero con una direccin por cada fondo, cada una
separada por una coma. Por ahora los nicos navegadores que pueden implementar esta
tcnica son WebKit (Safari) y KHTML (Konqueror). Pronto estar soportada por la
mayora de navegadores.

6. ROTAR TEXTOS
Es posible ahora rotar textos en cualquier ngulo. La clave de estas rotaciones se
encuentran en CSS Transformations, y tanto Firefox como Safari soportan esta ventaja:
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
Para realizar esta transformacin, el elemento debe tener seteada la propiedad display:
block;. Hay que aadir esta declaracin al SPAN que queramos rotar. ATENCION:

Internet Explorer no es compatible con este hack, por lo que deberemos hacer uso de los
filtros. Se inserta en el cdigo CSS igualmente:
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
Pero en el cdigo para Internet Explorer, se inserta un valor del 0 al 3, en vez de grados:
0:
1:
2:
3:

no rotar.
rotar 90 grados
rotar 180 grados
rotar 270 grados (-90 grados).

Terminamos con un ejemplo para mostrar la fecha rotada a 90, interesante para utilizar
en blogs:
.example-date {
background-color:#123;
border:1px solid #345;
padding:45px 5px 0;
position:relative; width:60px;
}
.example-date .example-day {
font-size:45px;
left:5px;
line-height:45px;
position:absolute; top:0;
}
.example-date .example-month {
font-size:25px;
text-transform:uppercase;
}
.example-date .example-year {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
display: block;
position: absolute;
right: -5px;top: 15px;
}
Y en el HTML usaremos el siguiente:

<div>
<span>31</span>
<span>July</span>
<span>2009</span>
</div>
Sin duda, son una serie de funciones nuevas que te permitirn sacar mximo provecho a
tus diseos sin que debas usar imgenes para lograrlo, creando as sitios web mucho
ms livianos y veloce

SASS
Al margen de las funciones propias definidas por Sass, tambin es posible definir
funciones propias para que puedas utilizarlas en tus hojas de estilos. Ejemplo:
$grid-width: 40px;
$gutter-width: 10px;
@function grid-width($n) {
@return $n * $grid-width + ($n - 1) * $gutter-width;
}
#sidebar { width: grid-width(5); }

El cdigo Sass anterior se compila de la siguiente manera:


#sidebar {
width: 240px;
}

Al igual que sucede con los mixins, las funciones pueden acceder a cualquier
variable global y tambin pueden aceptar argumentos. El contenido de una funcin
puede estar formado por varias lneas, pero siempre debe acabar con una
directiva de tipo @return para devolver el resultado de su ejecucin.
Las funciones propias tambin admiten el uso de argumentos con nombre. De
hecho, la funcin del ejemplo anterior tambin se puede utilizar de la siguiente
manera:
#sidebar { width: grid-width($n: 5); }

Para evitar posibles conflictos en el nombre de las funciones, es aconsejable


aadirles un prefijo. As adems los usuarios sabrn claramente que esas
funciones no forman parte ni de Sass ni de CSS. Una buena idea consiste en
utilizar como prefijo tu nombre o el de tu empresa. Si trabajas por ejemplo para la
empresa ACME S.A., la funcin anterior podra haberse llamado -acme-grid-width.
Por ltimo, las funciones propias tambin soportan el uso de un nmero variable
de argumentos, tal y como se explic en el captulo de los mixins.
Formato de salida
El formato utilizado por Sass para compilar los archivos CSS no slo es adecuado
sino que refleja bien la estructura del documento. No obstante, como los gustos (y
las necesidades) de los diseadores/as son muy particulares, Sass permite
configurar cmo se generan los archivos.
En concreto, Sass permite elegir entre cuatro formatos diferentes mediante la
opcin de configuracin: style o mediante la opcin --style de la consola de
comandos.

El formato: nested
Este es el estilo por defecto de Sass, que indenta y anida todos los selectores y
estilos para reflejar fielmente la estructura del archivo Sass original. Cada
propiedad se muestra en su propia lnea y cada regla se indenta tanto como sea
necesario en funcin de su anidamiento. Ejemplo:
#main {
color: #fff;
background-color: #000; }
#main p {
width: 10em; }
.huge {
font-size: 10em;
font-weight: bold;
text-decoration: underline; }

El estilo nested es muy til cuando se generan hojas de estilos CSS muy
complejas, ya que de un vistazo puedes entender toda su estructura.
El formato :expanded
Este estilo es ms parecido al que utilizara un diseador/a al crear
manualmente la hoja de estilos CSS. Cada propiedad y cada regla se muestran
en una nueva lnea, pero las reglas no se indentan de ninguna manera
especial. Ejemplo:
#main {
color: #fff;
background-color: #000;
}
#main p {
width: 10em;
}
.huge {
font-size: 10em;
font-weight: bold;
text-decoration: underline;
}

El formato :compact
Este estilo ocupa menos lneas que los estilos nested o expanded y prioriza los
selectores por encima de las propiedades. De hecho, cada regla CSS solamente
ocupa una lnea, donde se definen todas las propiedades. Las reglas anidadas
se muestran seguidas unas de otras (sin ningn salto de lnea) y solamente se
aade una lnea en blanco para separar los grupos de reglas CSS. Ejemplo:
#main { color: #fff; background-color: #000; }
#main p { width: 10em; }
.huge { font-size: 10em; font-weight: bold; text-decoration: underline; }

El formato :compressed
Este estilo es el ms conciso de todos porque no aade ningn espacio en
blanco, salvo el que sea estrictamente necesario para separar los selectores. El
nico salto de lnea que se aade es el del final del archivo. Este formato
tambin realiza otras optimizaciones y compresiones en valores como los
colores. Aunque no est pensado como formato para que lo lean los humanos,
puede ser muy til para comprimir al mximo las hojas de estilos CSS antes de
servirlas a los usuarios. Ejemplo:
#main{color:#fff;background-color:#000}#main p{width:10em}.huge{fontsize:10em;font-weight:bold;text-decoration:underline}

FOUNDATION

Você também pode gostar