getBase是一个轻量级的响应式CSS框架,拥有自定义排版、自定义网格、组件化等特性,让你可以花少量时间来覆盖样式,而将更多的时间花在创建漂亮的网站应用程序上。
特性基础扎实:建立在Normalize.css之上,确保设置了所有基本CSS样式。
多端统一:在所有现代浏览器的页面表现是完全一致的。
模块式编码:有多个独立模块,可以自由设计并组合模块。
自动化体验:包含 ParcelJS配置,可以自动化工作流
安装如果您是从头开始创建新项目,建议使用基础starter。
gitcloehttps://github.com/getbase/starter.git--depth=1\ew-website&&cdew-website&&rm-rf.git&&\pmistall&&pmstart对于现有项目,只需使用NPM安装getbase:
pmistall--save@getbase/base安装getBase后,可以选择要导入的内容并包含您自己的自定义样式。
HTML/CSS <!DOCTYPEhtml><html><head><metacharset="UTF-8"><metaame="viewport"cotet="width=device-width,iitial-scale=1.0"><title>YourWebsite/App</title><!--BaseCore--><likrel="stylesheet"href="https://upkg.com/@getbase/base/core.css"><!--BaseCommo--><likrel="stylesheet"href="https://upkg.com/@getbase/base/code.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/forms.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/tables.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/typography.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/headigs.css"><!--AddYourWebsite/AppStylesheet--><!--...--><!--AddAdditioalModules--><likrel="stylesheet"href="https://upkg.com/@getbase/base/cotaiers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/grid.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/horizotal-spacers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/vertical-spacers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/spacers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/display-helpers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/flex-helpers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/positio-helpers.css"><likrel="stylesheet"href="https://upkg.com/@getbase/base/typography-helpers.css"></head><body><p>Base!</p></body></html>CSS导入/*ImportBase*/@importurl("https://upkg.com/@getbase/base/core.css");/*ImportBaseCommo*/@importurl("https://upkg.com/@getbase/base/code.css");@importurl("https://upkg.com/@getbase/base/forms.css");@importurl("https://upkg.com/@getbase/base/tables.css");@importurl("https://upkg.com/@getbase/base/typography.css");@importurl("https://upkg.com/@getbase/base/headigs.css");/*AddYourWebsite/AppStyles*//*...*//*AddAdditioalModules*/@importurl("https://upkg.com/@getbase/base/cotaiers.css");@importurl("https://upkg.com/@getbase/base/grid.css");@importurl("https://upkg.com/@getbase/base/horizotal-spacers.css");@importurl("https://upkg.com/@getbase/base/vertical-spacers.css");@importurl("https://upkg.com/@getbase/base/spacers.css");@importurl("https://upkg.com/@getbase/base/display-helpers.css");@importurl("https://upkg.com/@getbase/base/flex-helpers.css");@importurl("https://upkg.com/@getbase/base/positio-helpers.css");@importurl("https://upkg.com/@getbase/base/typography-helpers.css");SCSS导入/*ImportBase*/@import"~@getbase/base/scss/_mixis";@import"~@getbase/base/scss/core";/*ImportBaseCommo*/@import"~@getbase/base/scss/code";@import"~@getbase/base/scss/forms";@import"~@getbase/base/scss/tables";@import"~@getbase/base/scss/typography";@import"~@getbase/base/scss/headigs";/*AddYourWebsite/AppStyles*/@import"mai";//AddAdditioalModules@import"~@getbase/base/scss/cotaiers";@import"~@getbase/base/scss/grid";@import"~@getbase/base/scss/horizotal-spacers";@import"~@getbase/base/scss/vertical-spacers";@import"~@getbase/base/scss/spacers";@import"~@getbase/base/scss/typography-helpers";@import"~@getbase/base/scss/display-helpers";@import"~@getbase/base/scss/flex-helpers";@import"~@getbase/base/scss/positio-helpers";LESS导入/*ImportBase*/@import"~@getbase/base/less/_mixis";@import"~@getbase/base/less/core";/*ImportBaseCommo*/@import"~@getbase/base/less/code";@import"~@getbase/base/less/forms";@import"~@getbase/base/less/tables";@import"~@getbase/base/less/typography";@import"~@getbase/base/less/headigs";/*AddYourWebsite/AppStyles*/@import"mai";//AddAdditioalModules@import"~@getbase/base/less/cotaiers";@import"~@getbase/base/less/grid";@import"~@getbase/base/less/horizotal-spacers";@import"~@getbase/base/less/vertical-spacers";@import"~@getbase/base/less/spacers";@import"~@getbase/base/less/typography-helpers";@import"~@getbase/base/less/display-helpers";@import"~@getbase/base/less/flex-helpers";@import"~@getbase/base/less/positio-helpers";









评论