前端框架之bootstrao基本使用

前端框架之bootstrap

建议使用3版本，不要轻易使用最新版本
响应式布局:根据显示器大小动态合理调整页面布局
CDN:内容分发网络
    为了加快对静态资源(不会经常改变的如图片、css文件、js文件)数据的访问速度
bootstrap涉及到动态效果需要使用jQuery，bootstrap是基于jQuery,也就意味着你在用bootstrap要先导入jQuery文件！！！

第一次使用bootstrap最好先下载源文件本地导入使用
    目的是为了让pycharm能够识别该框架提供的功能并自动提示
    如果直接使用CDN那么pycharm无法自动提示

# 使用bootstrap调节页面样式其实就是在修改标签的class值

选择器

选择器(为了查找我们需要查找的标签并操作)
    id选择器
        #d1 {}
    class选择器
        .c1 {}
    标签选择器
        div {}

 

基本使用

1.轮波图

 

 可在image处修改图片地址src，展示不同的图片

2.布局容器

相当于整个网页的风格
          container   左右有留白
        container-fluid   左右无留白

 

 

 

 3.栅格系统

Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。    row来划分一行(一个row是固定的12份)        在row里面通过col-md-n来划定需要几份    # 在划定的时候一定保证最多12

 

栅格参数