Tipografía
NanoCSS
Un framework CSS muy ligero
NanoCSS es un framework CSS ligero listo para usar que no requiere Javascript ni clases HTML. NanoCSS está diseñado para que puedas tener un sitio web listo en poco tiempo, con un código limpio y que puedas modificar y ampliar según tus necesidades.
Features
- Listo para usar. Solo descargar y añadirlo a tu web.
- Sin clases, solo etiquetas HTML5 estándar
- Muy ligero. Poco más de 1Kb minimizado y comprimido en gzip (si tu servidor lo tiene activado).
- Escrito usando SASS e incluye la paleta de 16 colores Clrs. Puedes cambiar los colores para varios elementos, o la paleta entera.
- Variante oscura, ideal si eres una criatura de la noche.
Como empezar
Para usar NanoCSS en tu sitio web sigue estos pasos:
- Descarga la ultima versión disponible desde la página de lanzamientos
- Dentro del paquete hay una carpeta llamada dist, en la cual hay 4 ficheros. Los que llevan -dark en el nombre son para usar el tema oscuro. Los .min.css contienen los estilos minimizados (esta todo en una sola linea), reduciendo su peso, y son los recomendados para usar en producción (cuando tu sitio web esta subido al servidor). Copia el que quieras a tu proyecto.
-
Dentro la cabecera del HTML (<head>) añade las siguientes etiquetas:
<meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="nanocss.min.css" />Solo cambia nanocss.min.css por la ruta y nombre del fichero CSS que vayas a usar.
- Y ya esta NanoCSS listo para ser usado.
Ejemplos:
Listas
- Lorem ipsum
- Lorem ipsum
-
Sub-lista:
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
- Sublist:
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
- Lorem ipsum
Botones:
Formulario
Tablas:
| Cantante | Grupo |
|---|---|
| Freddie Mercury | Queen |
| Kurk Cobain | Nirvana |
| John Lennon | Beatles |
| Jon Bon Jovi | Bon Jovi |
Imágenes responsivas
Blockquote
Esto es una cita
Pre y code
<pre><code>body
{
font-size: 16px;
color: #212121;
}</code></code>Vídeo
Audio
Podcast Remember 90 & 2000 Energy Power by Fran DeJota 19-10-2019