黑马程序员技术交流社区

标题: 【石家庄校区】学习笔记之Bootstrap 前端响应式框架 [打印本页]
作者: 奔跑的蜗牛006    时间: 2018-5-9 15:46
标题: 【石家庄校区】学习笔记之Bootstrap 前端响应式框架
本帖最后由 奔跑的蜗牛006 于 2018-5-9 16:00 编辑

Bootstrap:        前端响应式框架

响应式:        不同设备上可以通用,能适用多种页面大小;
百度已经设计好的样式直接用就可以.
案例二:使用Bootstrap设计一个响应式页面:
常用的两种:        . dist用于生产环境;        源码
准备工作:        引入CSS样式文件
​                        添加< meta>标签,根据设备宽度,调整缩放比例
​                        引入JS
布局容器:
​                        .container                固定宽度
​                        .container-fluid        100%占满
栅格系统:
​                将一个屏幕分成最多12列
​                使用.row样式定义栅格的行
​                定义列:        . col-lg-n/        大屏幕
​                                . col-md-n/        中等
​                                . col-sm-n/        小屏幕
​                                . col-xs-n/        超小屏幕
排版:
改变大小写:
表格:
Bootstrap组件:        
​                字体图标 icons
​                modal:        模态框
​                tab:                标签页
tab页:        手机应用的多.标签页,左右切换
alt:图片找不到后显示的内容        navbar:导航条
Dropdown:下拉        role               
ol / ul        Indicators:指示器
control:控制
carousel caption:
toggle:
default:默认
target:目标
modal:模态框
百度---Bootstrap---Bootstrap中文网---Bootstrap3中文文档---组件,JavaScript插件







欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2