Bulma CSS – 简介 Bulma CSS – 开始 Bulma CSS – CSS类 Bulma CSS – 模块化 Bulma CSS – 响应式
有数种方法可以安装Bulma:
使用npm安装Bulma包使用cdnjs CDN链接到Bulma样式表从GitHub项目库获得最新的开发版本https://cdnjs.com/libraries/bulma
https://github.com/jgthms/bulma/tree/master/css
如果想使用图标,可加上Font Awesome 字体图标库:
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>Bulma能正常工作需要把网页设置为支持响应式。
可以使用下面的模板作为写网页的起始模板:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Hello Bulma!</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css"> <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script> </head> <body> <section class="section"> <div class="container"> <h1 class="title"> Hello World </h1> <p class="subtitle"> My first website with <strong>Bulma</strong>! </p> </div> </section> </body> </html>如果习惯使用npm,可以使用Bulma-start。
Bulma-start是一个很小的npm包,包含了使用Bulma开发网站的全部依赖项。
Bulma-start 安装
npm install bulma-start或者
yarn add bulma-start详情可参考项目网址