版权声明 序 前言 第 1章 理解Bulma及其术语和概念 1 1.1 Bulma有何独特之处 1 1.2 简易的栅格系统 2 1.3 可读性 3 1.4 可定制 3 1.5 模块化 5 1.6 列 5 1.7 修饰符 6 1.8 组件 7 1.9 辅助类 8 1.10 小结 8 第 2章 Bulma表单开发 9 2.1 模板要求 9 2.2 居中布局 11 2.3 实现表单内容 13 2.3.1 logo 14 2.3.2 邮箱输入框 15 2.3.3 密码输入框 17 2.3.4 复选框 17 2.3.5 登录按钮 18 2.4 小结 18 第3章 站点导航和侧边栏菜单 20 3.1 创建导航栏 21 3.1.1 导航品牌标志 21 3.1.2 导航菜单 23 3.1.3 下拉菜单 24 3.2 页面主区域 26 3.3 侧边栏菜单 27 3.4 小结 30 第4章 实现响应式栅格 31 4.1 工具栏 32 4.1.1 level组件和navbar组件的相似性 32 4.1.2 创建工具栏 32 4.2 图书栅格 34 4.3 图书项 36 4.4 分页 39 4.5 小结 40 第5章 创建面包屑导航和文件上传功能 41 5.1 图书详情页模板 41 5.1.1 面包屑 42 5.1.2 图书录入表单 42 5.2 编辑页面模板 46 5.3 小结 48 第6章 创建表格和下拉菜单 49 6.1 客户列表 49 6.1.1 更新工具栏 50 6.1.2 实现客户表格 51 6.2 新建客户页面 53 6.3 小结 58 第7章 创建更多表格及下拉菜单 59 7.1 订单列表 60 7.2 订单编辑页面 62 7.2.1 订单信息 64 7.2.2 图书列表 65 7.2.3 行内表单 67 7.3 小结 69 第8章 创建通知和卡片功能 70 8.1 标题、时间范围 71 8.2 核心指标 72 8.3 *新订单列表 74 8.4 使用card组件展示热门图书 76 8.5 忠实客户 78 8.6 小结 81 第9章 在原生JavaScript中应用Bulma 82 9.1 问题报告模态框 82 9.2 移动端toggle菜单 85 9.3 通知 86 9.4 下拉菜单 86 9.5 删除图书功能 87 9.6 删除客户功能 88 9.7 小结 88 第 10章 在Angular中使用Bulma 89 10.1 准备 90 10.2 应用 91 10.3 组件 91 10.4 小结 106 第 11章 在Vue.js中使用Bulma 107 11.1 安装vue-cli 107 11.2 创建Vue应用程序 108 11.2.1 创建页面 109 11.2.2 vue-router 109 11.3 安装Bulma 111 11.3.1 方法一:CDN引入 111 11.3.2 方法二:npm包引入(**) 111 11.3.3 使用Font-Awesome字体 113 11.4 Vue组件 114 11.5 管理页面骨架 114 11.6 实现Dashboard 117 11.7 登录页面 121 11.8 创建问题报告组件 124 11.8.1 创建组件 125 11.8.2 将模态框添加到App模板 129 11.9 图书页面 130 11.9.1 图书排序 131 11.9.2 过滤图书 132 11.9.3 创建和编辑图书 133 11.10 小结 136 第 12章 在React中使用Bulma 137 12.1 本章目标 137 12.2 安装create-react-app 138 12.3 create-react-app速览 138 12.4 安装Bulma 139 12.4.1 选项1:通过CDN添加Bulma 139 12.4.2 选项2:通过npm添加Bulma 140 12.5 使用React Router 4编写路由 140 12.5.1 141 12.5.2 141 12.5.3 带有路由的*终版App.js 142 12.6 创建登录组件 142 12.6.1 Login.jsx 143 12.6.2 创建登录表单 145 12.7 创建收藏 149 12.7.1 页眉 150 12.7.2 Header.jsx 150 12.7.3 HeaderBrand.jsx 152 12.7.4 HeaderUserControls.jsx 154 12.7.5 整合页眉 156 12.8 Footer.jsx 157 12.9 图书收藏主体 158 12.9.1 Collection.jsx 159 12.9.2 CollectionSingleBook.jsx 161 12.9.3 CollectionSingleBookDetail.jsx 162 12.9.4 整合收藏组件 164 12.10 运行应用 166 12.11 小结 166 第 13章 自定义Bulma 167 13.1 安装node-sass 168 13.1.1 创建package.json 168 13.1.2 创建sass/custom.scss文件 169 13.2 导入Bulma 171 13.3 导入谷歌字体 172 13.4 导入自己的变量 172 13.5 理解Bulma变量 173 13.6 覆盖Bulma的初始变量 174 13.7 覆盖Bulma的组件变量 175 13.8 修改HTML 179 13.9 自定义规则 180 13.9.1 第二字体 180 13.9.3 使用Rubik字体 183 13.9.4 修改侧边栏菜单 184 13.9.5 修补导航栏 186 13.9.6 优化表格 187 13.9.7 标题加粗 187 13.10 使用Bulma混入实现响应式 188 13.11 小结 190