hernandezblasantonio/pw/documentacion/html/css/otros/basscss

Basscss

Basscss is a lightweight collection of immutable utilities designed for speed, clarity, performance, and scalability. - basscss.com

Uso

Basscss es ofrecido mediante una base de estilos de CSS y a partir de este se agregan módulos (addons) para extender los estilos definidos en la base. Por otro lado se ofrece todo esto en un único archivo (bundle), el cual será usado a continuación: ace-css.

  1. Accede al directorio (crealo de ser necesario) $HOME/www y crea el directorio basscss01:

     alumno@servidor:~ $ cd $HOME/www
 alumno@servidor:~/www $ mkdir basscss01
 alumno@servidor:~/www $ cd basscss01

  2. Crea el directorio css y al archivo vácio css/main.css en él:

     alumno@servidor:~/www/basscss01 $ mkdir css
 alumno@servidor:~/www/basscss01 $ touch css/main.css

  3. Accede a https://github.com/basscss/ace/releases, determina la última versión disponible de ace-css y descarga el archivo ace.min.css en el directorio ace-css:

     alumno@servidor:~/www/basscss01 $ cd css
 alumno@servidor:~/www/basscss01/css $ mkdir ace-css
 alumno@servidor:~/www/basscss01/css $ cd ace-css
 alumno@servidor:~/www/basscss01/css/ace-css $ wget https://unpkg.com/ace-css@1.1.0/css/ace.min.css

    En este caso se ha descargado la versión 1.1.0.

  4. Crea el archivo index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
   <head>
     <meta charset="UTF-8">
     <title>basscss01</title>
     <link href="css/ace-css/ace.min.css" rel="stylesheet" type="text/css" />
   </head>
   <body>
     <!-- CONTENIDO -->
     <!-- /CONTENIDO -->
   </body>
 </html>

    Notas:

    • El contenido de tu documento HTML, y que será visualizado por el usuario, quedará dentro de los comentarios CONTENIDO.
    • Si requieres modificar el aspecto visual o estilo de algún elemento HTML lo llevas a cabo en el archivo css/main.css. Recuerda que tendrás que hacer uso de selectores de CSS.

Al terminar en el directorio $HOME/www/basscss01 encontrarás la siguiente estructura:

alumno@servidor:~/www/basscss01 $ pwd && tree
/home/alumno/www/basscss01
.
├── css
│   ├── ace-css
│   │   └── ace.min.css
│   └── main.css
└── index.html

2 directories, 3 files