unitscss

Unidades

Conjunto de componentes simples y hermosos.

https://unitscss.com/

Documento

Inglés / 日本語

Característica

Unidades es un conjunto de componentes simple y hermoso. Todo lo que tiene que hacer es simplemente cargar archivos CSS, copiar y pegar fragmentos, tan fácil que cualquiera puede usar.

• Usar rápidamente
  Todo lo que tienes que hacer es simplemente poner unidades.css. Ya se han preparado varios componentes y puede elegir componentes que desea usar y aplicarlos en su sitio web.

• Simple y hermoso
  Cada componentes está bellamente diseñado. El diseño se actualizará periódicamente, no aplicaremos grandes cambios, pero solo aplicará pequeños cambios, como ajustar los márgenes.

• Apoyo al navegador moderno
  Las unidades se optimizan para usarse en el navegador moderno como Microsoft Edge, Google Chrome, Firefox, Safari, ¿qué hay de los navegadores antiguos? ... Lo lamento.

• Diseño web receptivo
  Utilizamos aproximaciones de diseño web receptivo para mostrar un diseño optimizado en todos los dispositivos.

• Actualización periódica
  Unidades sigue siendo una versión beta, se actualizará periódicamente a una versión importante. Unitil La versión principal, agregaremos nuevos componentes, optimizaremos los códigos de origen, ajustando su diseño.

• Apoyar japonés
  Porque los desarrolladores son japoneses que podemos apoyar en japonés. Hemos estado optimizando páginas web y actualizando documentos escritos en japonés.

Instalación

Las unidades en sí se pueden descargar de GitHub clonándolo o como formato de cremallera, o puede descargarlo a través de NPM.

$ git clone https://github.com/kokushin/unitscss.git

$ npm install unitscss --save

Cargamos los archivos necesarios.

 < link rel =" stylesheet " href =" https://fonts.googleapis.com/css?family=Roboto:400,700 " >
< link rel =" stylesheet " href =" path/to/units.min.css " >

< script src =" path/to/units.min.js " > </ script > 

Uso

Escribe fragmentos HTML exactos y dale las clases correctas que comienzan con uc- . Por ejemplo, en la muestra a continuación puede hacer un componente de tarjeta conectado con una imagen cubierta.

 < div class =" uc-card _float " >
  < div class =" uc-card-image " style =" background-image:url(https://source.unsplash.com/random) " > </ div >
  < h3 class =" uc-card-title " > Sample card </ h3 >
  < p > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur, et. </ p >
  < div class =" uc-btn _primary " > < a href =" # " > Button </ a > </ div >
</ div >

Se mostrará en el navegador así:

Manifestación

https://unitscss.com/themes/

Fragmentos

Consulte CodePen.

Descargar

Descargar zip

Github

https://github.com/kokushin/units

Contribuyente

@Kokushin

Licencia

Código y documentación Copyright 2017 por Kokushin. Código publicado bajo la licencia MIT.