NES.css

697

0

NES.css

scss nes 8bit

NES.css 是一款 NES-风格(8位机) 的CSS 框架.

NES.css: NES-style CSS framework

NES.css 是一款 NES-风格(8位机) 的CSS 框架.

[Gitter] Commitizen friendly

安装

via package manager

npm install nes.css
# or
yarn add nes.css
AltCSS(sass, scss...)
// style.scss
@import "./node_modules/nes.css/css/nes.css"
JavaScript
// script.js
import "nes.css/css/nes.min.css";

您需要安装css加载程序.

HTML
<!-- index.html -->
<html>
  <head>
    <link rel="stylesheet" href="./node_modules/nes.css/css/nes.min.css">
  </head>
  <body></body>
</html>

via CDN

<!-- non-minified -->
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css@latest/css/nes.min.css" rel="stylesheet" />
<!-- core style only -->
<link href="https://unpkg.com/nes.css/css/nes-core.min.css" rel="stylesheet" />

推荐字体

语言 字体
(默认) Press Start 2P
英语 Kongtext
日语 美咲フォント
日语 Nu もち
韩语 둥근모꼴
中文 Zpix (最像素)

使用

NES.css 只提供组件. 你需要定义你自己的布局.

默认字体Press Start 2P 只支持英文字符. 当你把这个框架与其他非英语的语言一起使用的时候, 请使用另外的字体. 请根据这个关于Google Fonts的 说明 了解如何把它引入项目, 或者按照如下方式简单引入:

<head>
    <link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
    <link href="https://unpkg.com/nes.css/css/nes.css" rel="stylesheet" />
    <style>
      html, body, pre, code, kbd, samp {
          font-family: "font-family you want to use";
      }
    </style>
</head>

只需要CSS

NES.css 仅仅需要 CSS 而不依赖其他任何 JavaScript.

浏览器支持

NES.css 与如下浏览器的最新版本兼容.

  • Chrome
  • Firefox
  • Safari

未经测试

  • IE/Edge

版权许可

代码以及文档版权 2018 B.C.Rikko. 代码基于MIT许可发布. 文档基于Creative Commons许可发布.

NES.css: NES-style CSS framework

NES.css 是一款 NES-风格(8位机) 的CSS 框架.

[Gitter] Commitizen friendly

安装

via package manager

npm install nes.css
# or
yarn add nes.css
AltCSS(sass, scss...)
// style.scss
@import "./node_modules/nes.css/css/nes.css"
JavaScript
// script.js
import "nes.css/css/nes.min.css";

您需要安装css加载程序.

HTML
<!-- index.html -->
<html>
  <head>
    <link rel="stylesheet" href="./node_modules/nes.css/css/nes.min.css">
  </head>
  <body></body>
</html>

via CDN

<!-- non-minified -->
<link href="https://unpkg.com/nes.css@2.3.0/css/nes.min.css" rel="stylesheet" />
<!-- latest -->
<link href="https://unpkg.com/nes.css@latest/css/nes.min.css" rel="stylesheet" />
<!-- core style only -->
<link href="https://unpkg.com/nes.css/css/nes-core.min.css" rel="stylesheet" />

推荐字体

语言 字体
(默认) Press Start 2P
英语 Kongtext
日语 美咲フォント
日语 Nu もち
韩语 둥근모꼴
中文 Zpix (最像素)

使用

NES.css 只提供组件. 你需要定义你自己的布局.

默认字体Press Start 2P 只支持英文字符. 当你把这个框架与其他非英语的语言一起使用的时候, 请使用另外的字体. 请根据这个关于Google Fonts的 说明 了解如何把它引入项目, 或者按照如下方式简单引入:

<head>
    <link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
    <link href="https://unpkg.com/nes.css/css/nes.css" rel="stylesheet" />
    <style>
      html, body, pre, code, kbd, samp {
          font-family: "font-family you want to use";
      }
    </style>
</head>

只需要CSS

NES.css 仅仅需要 CSS 而不依赖其他任何 JavaScript.

浏览器支持

NES.css 与如下浏览器的最新版本兼容.

  • Chrome
  • Firefox
  • Safari

未经测试

  • IE/Edge

版权许可

代码以及文档版权 2018 B.C.Rikko. 代码基于MIT许可发布. 文档基于Creative Commons许可发布.

看看其他 lax.js 设计数据密集型应用 FlutterUnit Glide Data Grid NPlayer NGINX Config DongTai Prisma Medoo Hoppscotch