【推荐语】
1.知识、系统 本书知识点覆盖工具类、布局、组件等主要内容,满足学ootstrap 5 的需求。本书是Bootstrap 5 在前端开发中经常使用能有重大的内容,可用于解决框架开发的大多数问题,读者可以用很少的时间识得 Bootstrap 5 的全貌,并深入学的应用。 2.案例丰富、实用 本书多以案例形式讲解 Bootstrap 5 元素,并给出针对具体内容的应用示例,还在后给出面向应用的综合案例。本书将一些 Bootstrap 5 组件与传统的 DIV+CSS 布行对比讲解,有助于读者更深入地掌握框架的应用。 3.资源、齐全 本书提供案例的源码和素材资源,方便读行实践训练。本书的案例都通过上机实践,结果运行无误;此外,本书还提供PPT 课件、教学大纲、教学思维导图、考答案等。读者可以到人邮教育社区(.ryjiaoyu.)下载本书的配套资源。
【目录】
【章名目录】 第 1章;;Bootstrap概述 第 2章;;Bootstrap 5的基础样式 第3章;;Bootstrap 5的工具类 第4章;;Bootstrap 5的弹布局 第5章;;Bootstrap 5的栅格布局 第6章;;Bootstrap 5的组件(一) 第7章;;Bootstrap 5的组件(二) 第8章;;Bootstrap 5的表单 第9章;;定制与优化Bootstrap 5 第 10章;;综合案例1——Web学的设计 第 11章;;综合案例2——产品展示网站的设计 【详细目录】 第 1章;;Bootstrap概述 1.1;;认识Bootstrap;;1 1.2;;Bootstrap的版本;;2 1.3;;Bootstrap 5的特点;;2 1.4;;Bootstrap 5的内容;;3 1.5;;Bootstrap 5的下载;;4 1.6;;Bootstrap 5的结构;;5 1.6.1;;Bootstrap 5编译版文件的目录结构;;5 1.6.2;;Bootstrap 5源码文件的目录结构;;6 1.7;;引入Bootstrap 5;;6 1.8;;开发工具;;7 1.8.1;;VS Code;;7 1.8.2;;WebStorm;;9 1.9;;使用Bootstrap 5创建网页;;9 nbsp;;14 第 2章;;Bootstrap 5的基础样式 2.1;;文字版式;;16 2.1.1;;样式;;16 2.1.2;;标题;;16 2.1.3;;内联文本元素;;19 2.1.4;;缩略语;;19 2.1.5;;引用;; 2.1.6;;列表;;21 2.2;;图片;;23 2.3;;表格;;24 2.4;;轮廓;;28 nbsp;;29 第3章;;Bootstrap 5的工具类 3.1;;认识工具类;;30 3.1.1;;工具类的引入;;30 3.1.2;;工具类的命名;;31 3.2;;颜色工具类;;33 3.2.1;;文本颜色和背景颜色;;33 3.2.2;;链接颜色;;34 3.3;;边框工具类;;35 3.3.1;;添加和删除边框;;35 3.3.2;;圆角边框;;36 3.4;;边距工具类;;37 3.4.1;;外边距和内边距;;37 3.4.2;;响应式边距;;38 3.5;;宽度和高度工具类;;39 3.6;;显示和浮动工具类;;41 3.6.1;;显示工具类;;41 3.6.2;;浮动工具类;;44 3.7;;文本工具类;;45 3.7.1;;文本对齐;;45 3.7.2;;文本换行;;45 3.7.3;;文本转换;;47 3.7.4;;控制文本字号、样式和行高等的工具类;;47 3.8;;其他工具类;;48 3.8.1;;弹盒子工具类;;48 3.8.2;;位置工具类;;49 3.8.3;;阴影工具类;;49 3.9;;工具类的应用;;49 nbsp;;52 第4章;;Bootstrap 5的弹布局 4.1;;弹布局的概念;;54 4.2;;弹布局容器的样式;;55 4.2.1;;项目对齐的工具类;;56 4.2.2;;排列方向的工具类;;59 4.2.3;;项目换行的工具类;;60 4.3;;弹布局项目的样式;;62 4.3.1;;项目排序的工具类;;62 4.3.2;;项目伸缩的工具类;;62 4.3.3;;自身对齐的工具类;;65 4.3.4;;自动浮动的工具类;;66 4.4;;弹布局的应用;;67 4.4.1;;图文混排的实现;;67 4.4.2;;响应式页面的实现;;69 nbsp;;71 第5章;;Bootstrap 5的栅格布局 5.1;;栅格布局的基础知识;;73 5.1.1;;视口和断点;;73 5.1.2;;栅格布局的原则;;74 5.1.3;;Bootstrap 5的设备参数;;74 5.1.4;;栅格布局使用的类;;75 5.2;;自动布局列;;76 5.2.1;;等宽列;;76 5.2.2;;自动宽度列;;78 5.3;;响应式布局类;;79 5.3.1;;覆盖所有设备;;80 5.3.2;;水平排列;;80 5.3.3;;匹配多种类型的设备;;81 5.4;;嵌套;;82 5.5;;列布局;;83 5.5.1;;列排序;;83 5.5.2;;列偏移;;84 5.6;;栅格布局的应用;;86 nbsp;;90 第6章;;Bootstrap 5的组件(一) 6.1;;按钮和按钮组;;92 6.1.1;;按钮;;92 6.1.2;;按钮组;;94 6.2;;导航;;96 6.2.1;;创建导航;;96 6.2.2;;两种不同样式的导航;;97 6.2.3;;标签页;;97 6.3;;导航条;;99 6.3.1;;创建基本样式导航条;;99 6.3.2;;创建响应式导航条;;100 6.3.3;;在导航条中添加表单和下拉菜单;;101 6.4;;徽章;;103 6.5;;列表组和分页;;103 6.5.1;;列表组;;103 6.5.2;;分页;;106 6.6;度条;;107 6.7;;卡片;;108 6.7.1;;创建卡片;;108 6.7.2;;卡片的组成元素;;109 6.7.3;;用卡片实现的缩略图;;112 6.8;;组件的应用——网站后台管理系统;;113 6.8.1;;页面结构的描述;;113 6.8.2;;导航部分的设计;;115 6.8.3;;主体部分的设计;;116 nbsp;;119 第7章;;Bootstrap 5的组件(二) 7.1;;模态对话框;;121 7.2;;下拉菜单;;123 7.3;;提示组件;;126 7.3.1;;工具提示框;;126 7.3.2;;弹出提示框;;127 7.3.3;;警告框;;128 7.4;;折叠组件和手风琴组件;;129 7.4.1;;折叠组件;;129 7.4.2;;手风琴组件;;131 7.5;;轮播组件;;133 7.5.1;;创建轮播组件;;133 7.5.2;;轮播组件的结构;;134 7.6;;滚动监听组件;;135 7.6.1;;监听导航;;135 7.6.2;;监听导航条;;136 7.7;;组件的应用——轮播广告;;138 7.7.1;;页面结构的描述;;138 7.7.2;;导航部分的设计;;139 7.7.3;;轮播广告部分的设计;;140 7.7.4;;CSS代码;;142 nbsp;;143 第8章;;Bootstrap 5的表单 8.1;;表单控件;;145 8.1.1;;输入框;;145 8.1.2;;单选按钮和复选框;;147 8.1.3;;下拉列表;;150 8.1.4;;滑动条;;151 8.1.5;;输入框组;;151 8.2;;表单布局;;152 8.2.1;;内联表单;;152 8.2.2;;水平表单;;154 8.2.3;;复杂表单;;156 8.3;;表单的校验;;158 8.4;;表单的应用——响应式表单;;160 8.4.1;;页面结构的描述;;160 8.4.2;;导航部分的设计;;161 8.4.3;;表单部分的设计;;162 8.4.4;;CSS代码;;163 nbsp;;165 第9章;;定制与优化Bootstrap 5 9.1;;CSS预处理程序;;166 9.1.1;;CSS预处理程序的概念;;166 9.1.2;;引入CSS预处理程序的原因;;166 9.2;;Sass的安装与使用;;168 9.2.1;;安装Ruby;;168 9.2.2;;安装Sass和Sass命令;;169 9.3;;Sass的基本应用;;170 9.3.1;;使用变量;;170 9.3.2;;计能;;171 9.3.3;;选择器嵌套;;171 9.3.4;;注释;;172 9.3.5;;代码重用;;173 9.3.6;;控制语句;;176 9.4;;Sass的扩展库Compassp;;179 9.4.1;;Compass的安装;;179 9.4.2;;Compass的内置模块;;179 9.4.3;;Compass的Helpers函数;;183 9.5;;Sass的应用——修改Bootstrap 5源码;;184 nbsp;;186 第 10章;;综合案例1——Web学的设计 10.1;;页面分析;;187 10.1.1;;页面结构设计;;187 10.1.2;;引入Web框架;;189 10.1.3;;案例中的Bootstrap 5元素;;190 10.2;;页头部分的设计;;190 10.2.1;;顶部导航条;;191 10.2.2;;banner栏目;;193 10.2.3;;搜索栏目;;194 10.3;;课程和大纲等模块的设计;;195 10.4;;学、教学团队和问答等模块的设计;;198 10.4.1;;学模块;;198 10.4.2;;教学团队模块;;199 10.4.3;;问答模块;;2 10.5;;页脚部分的设计;;3 nbsp;;6 第 11章;;综合案例2——产品展示网站的设计 11.1;;页面分析;;8 11.1.1;;页面结构设计;;8 11.1.2;;引入Web框架;;210 11.1.3;;案例中的全局样式;;211 11.2;;页头部分的设计;;211 11.3;;轮播模块的设计;;213 11.4;;热点机型和智能电视模块的设计;;216 11.4.1;;热点机型模块的设计;;216 11.4.2;;智能电视模块的设计;;219 11.5;;产品模块的设计;;2 11.6;;附件和页脚的设计;;224 nbsp;;226 参考文献
返回顶部