Bootstrap简单介绍

TERSUS开发时选用的当前主流使用的新移动应用模板，是集成Bootstrap样式框架的，Bootstrap是一个简洁、直观、强悍的前端开发框架，让web开发更迅速、简单

  • Bootstrap相关信息请参考：https://v2.bootcss.com/index.html
  • 集成的Bootstrap样式框架含有一套39个从变量到响应式样式定义的LESS文件（位置：TERSUS项目文件夹\web\styles\bootstrap）
  • 集成的Bootstrap样式框架中预定义了140个黑色和140个白色图标文件（位置：TERSUS项目文件夹\web\images\bootstrap），参考本章下一节“样式设计中图标使用”的说明
  • 注意所有文件中定义的样式类名称，都是用本章“用样式类定义样式”一节中方式调用的


    默认新建的新移动应用项目的bootstrap样式文件说明：

    | 文件名称 | 定义内容说明 | | —- | —- | | 001-reset.less | 音/视频显示块定义、HTML页/图片/按钮/输入框显示位置及大小基本定义 | | 002-variables.less | 变量定义：常用的颜色值、链接/按钮/表格/布局/表单等元件等使用的颜色及字符大小的变量定义、Bootstrap图标文件地址定义 | | 003-mixins.less | Mixins可以将一部分需重用的样式抽出，只需定义一次，可被重复使用 | | 004-scaffolding.less | HTML 主体/链接/图片的默认样式 | | 005-grid.less | Grid网格对象中的样式定义 | | 006-layouts.less | 布局元件使用，定义一个container名称的样式类，并定义其中子元件显示样式 | | 007-type.less | 页面中字符样式定义、特别的字号、标题标签如h1 h2 h3…、表头样式、列表样式、缩写类样式、引用内容样式、地址样式 | | 008-code.less | 代码内容显示的样式 | | 009-forms.less | 表单的样式、带标签的输入框样式、各类输入框元件样式、勾选等元件样式 | | 010-tables.less | 表格对象的样式、基本样式/紧凑样式/带边框样式/斑马条样式/滑动变色样式/单元格大小样式/背景色样式等定义内容 | | 011-sprites.less | Bootstrap图标名称位置定义，黑色及白色类定义，注意对应的图标文件地址在002-variables.less有定义 | | 012-dropdowns.less | 下拉按钮的样式定义 | | 013-wells.less | 一种会引起内容凹陷显示或插图效果的容器样式定义 | | 014-component-animations.less | 渐变等动态效果样式 | | 015-close.less | 关闭图标的样式 | | 016-buttons.less | 按钮的样式定义，包括按钮颜色样式/尺寸/状态/背景色 | | 017-button-groups.less | 按钮组样式，按钮组中各类不同按钮显示样式 | | 018-alerts.less | 报警类提示类的样式，不同颜色定义 | | 019-navs.less | 导航类的样式定义 | | 020-navbar.less | 导航条的样式定义 | | 021-breadcrumbs.less | 面包屑导航样式定义 | | 022-pagination.less | 分页为每个页面做导航的样式 | | 023-pager.less | 翻页导航样式 | | 024-modals.less | 弹窗的样式，包括正常弹窗/大弹窗定义/弹窗头部样式/内部主体样式/底部样式定义 | | 025-tooltip.less | 工具提示框样式，包括提示框内部设定图标 | | 026-popovers.less | 简单弹窗样式，标题/内容/图标等样式 | | 027-thumbnails.less | 缩略图的样式 | | 028-media.less | 媒体类型的样式 | | 029-labels-badges.less | 标签显示及徽章类的样式 | | 030-progress-bars.less | 进度条样式定义 | | 031-accordion.less | 垂直手风琴效果样式 | | 032-carousel.less | 轮播图样式，控制及图中文字显示样式 | | 033-hero-unit.less | 巨幕样式，用于展示放大提示的样式 | | 034-utilities.less | 类对象属性的样式，如是否显示，靠左靠右等 | | 035-responsive-utilities.less | 响应式处理样式 | | responsive-767px-max.less | 响应式处理样式，最大767px | | responsive-768px-979px.less | 响应式处理样式768px-979px | | responsive-1200px-min.less | 响应式处理样式，最小1200px | | responsive-navbar.less | 导航条响应式处理样式 |