Bootstrap使用指南

本课程主要以大量代码编写实例来展开,通过讲解Bootstrap这一目前非常流行的前端开发框架,帮助有一定HTML、CSS和JavaScript基础的学生非常简单快速地开发支持响应式布局、移动设备优先的Web项目。
28 个视频 关注课程
1
第一章 初识Bootstrap
1-1
本节课对Bootstrap进行了一个简单介绍,讲解了Bootstrap的特性及其应用场景,另外还介绍了如何下载Bootstrap。
1-2
本节课分析讲解了Bootstrap基础HTML模版,如何引入Bootstrap文件。
1-3
本节课讲解如何通过引入Bootstrap来实现一个基本的入门案例。
2
第二章 Bootstrap全局CSS样式
2-1
本节课介绍了Bootstrap的栅格系统,包括栅格系统工作原理的简单介绍以及栅格系统针对响应式设计设置的参数,栅格系统的使用方法。
2-2
本节主要是讲述HTML页面基础排版(Typography)方面所需要的各种技能,比如head标题(h1至h6)、页面主体、内联文本元素、对齐、改变大小写等。
2-3
本节课讲述Bootstrap针对代码显示提供的几种方式,包括内联代码、用户输入代码、多行代码块等
2-4
本节课主要讲解Bootstrap表格,包括基本样式的表格、条纹状表格、带边框的表格、鼠标悬停效果表格、紧缩表格,以及状态类和响应式表格。
2-5
本节课介绍了Bootstrap表单的样式,包括基础表单、内联表单和水平排列的表单。
2-6
本节课介绍了Bootstrap的表单控件和静态控件。
2-7
本节课讲解了Bootstrap表单中的控件状态,包括焦点状态、禁用状态、只读状态和校验状态,以及控件尺寸调整和表单控件辅助文本。
2-8
本节课讲解Bootstrap按钮,包括Bootstrap提供的预定义按钮样式,按钮尺寸以及按钮状态。
2-9
本节课介绍如何使用Bootstrap为图片增加响应式布局支持,以及Bootstrap针对图片显示提供的图片形状效果。
3
第三章 Bootstrap组件
3-1
本节课讲解Bootstrap组件当中的字体图标和下拉菜单,通过代码实例来介绍其基本用法及样式增改。
3-2
本节课讲解按钮组,通过按钮组容器将一组按钮组合在一起使用,包括按钮组基本用法,按钮工具栏,按钮组按钮尺寸调整,按钮组的嵌套分组、垂直分组和自适应两端对齐排列分组。
3-3
本节课讲解按钮式下拉菜单,为按钮添加菜单标签将其作为菜单的触发器,包括单按钮下拉菜单,分裂式按钮下拉菜单,按钮式下拉菜单中按钮尺寸调整和向上弹出式菜单。
3-4
本节课讲解Bootstrap组件中的输入框组,包括其基本用法,输入框组尺寸调整,以及作为额外元素为输入框组添加多选框、单选框、按钮、按钮式下拉菜单和分裂式按钮下拉菜单。
3-5
本节课讲解Bootstrap组件中的导航,包括标签页和胶囊式标签页,标签页自适应两端对齐,在导航组件中禁用链接,以及为导航标签页添加下拉菜单。
3-6
本节课讲解Bootstrap组件中的导航条,包括默认样式的导航条,为导航条添加品牌图标、表单、按钮、下拉菜单、文本和非导航的链接,导航条中组件元素的对齐排列,导航条的位置调整(包括固定在顶部和底部,静止在顶部),反色样式的导航条,以及让导航条支持自适应相应式布局。
3-7
本节课讲解Bootstrap组件中的面包屑导航(或者叫路径导航)和分页,重点介绍分页组件,包括分页的基本用法,禁用和激活分页中的链接状态,调整分页组件的大小,以及如何使用简单的翻页。
3-8
本节课讲解Bootstrap组件中的标签和徽章,包括标签的用法、标签样式,以及在链接、导航等元素中如何使用徽章进行消息条目的展示。
3-9
本节课讲解Bootstrap组件中的巨幕和页面标题,主要介绍其基本用法。
3-10
本节课讲解Bootstrap组件中的缩略图和警告框,包括默认样式的缩略图、支持自定义内容的缩略图,警告框的基本用法、为警告框添加关闭按钮和链接。
3-11
本节课讲解Bootstrap组件中的进度条,包括进度条的基本用法,带有提示标签的进度条,为进度条添加颜色、条纹、动画等效果,以及堆叠样式的进度条。
3-12
本节课讲解Bootstrap组件中的媒体对象,包括媒体对象的基本用法,调整图片等媒体的对齐方式,以及媒体对象列表。
3-13
本节课讲解Bootstrap组件中的列表组,包括列表组的基本用法,给列表组添加徽章、设置链接,包含按钮的列表组,在列表组中禁用条目,为列表组添加颜色样式,以及具备自定义内容的列表组。
3-14
本节课讲解Bootstrap组件中的面板,包括其基本用法,带标题的面板,带脚注的面板,为面板设置情境颜色效果,带表格的面板,以及带列表组的面板。
3-15
本节课讲解Bootstrap组件中具有响应式特性的嵌入内容和Well,主要介绍其基本用法。
4
第四章 Bootstrap JavaScript插件
4-1
本节课介绍Bootstrap的JavaScript插件概述,包括JavaScript插件的引入方式、data属性、编程方式的API、如何避免命名空间冲突、事件、版本号、浏览器的JavaScript被禁用的情况及关于第三方工具库的支持等内容。