Core CSS

The core of SACSS is the naming convention, and core code is a CSS file.

Installation#

$ npm i sacss

Use#

<link rel="stylesheet" href="./node_modules/sacss/index.css" />

global Just introduce the sacss/index.css file, which contains most of the parts needed to build the UI structure, such as

display layout
float layout
flex layout
position layout
font-weight 100 to 900

... See source for more.

The overall core code is only 2kb uncompressed, and the compressed version is only 93b, global introduction will not cause any stress, and SACSS also recommends only global references.

For building another part of the UI style, you can click here to learn about it.

⚠️ Note: The introduction of files in node_modules requires build tool support.

CDN#

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sacss/index.min.css" />

If you don't have a build tool like webpack, you can use the jsdelivr CDN directly, or just download this file locally to use.