zoukankan      html  css  js  c++  java
  • bootstrp-3.0

    # Bootstrap,

    ## 一、Bootstrap简介

    ### 1. Bootstrap是什么?

    ​ Bootstrap是Twitter推出的一个开源的前端开发框架

    ​ 基于HTML、CSS、JavaScript,代码简洁、视觉优美,用来快速开发基于PC及移动端的Web页面,更迅速、简单

    ​ Bootstrap官网:http://getbootstrap.com/

    ​ 中文网:http://www.bootcss.com/

    ​ 版本:v3.0、v4.0

    ### 2. 特点

    - 跨设备、跨浏览器

    兼容所有主流浏览器,包括IE7、IE8等

    - 响应式布局

    支持PC端、移动端(手机、PAD),移动设备优先

    - 丰富的组件

    表单、下拉菜单、导航、标签、徽章、面板等

    - 内置jQuery插件
    模态框、工具提示、弹出框、轮播图等

    - 支持动态样式

    LESS、SASS,可以使用变量、嵌套、混合等,编写样式更快、更灵活

    ## 二、起步

    ### 1. 下载

    ​ CDN:Content Delivery Network,内容分发网络,提供稳定、快速的资源访问服务。

    ​ **Bootstrap依赖于jQuery库**

    ### 2. 基本模板

    ​ HTML5文档类型

    ​ 移动设备优先

    ​ 基本的全局样式

    ```css
    font-size: 14px;
    line-height: 20px;
    color: #333;
    a{color: #337ab7; text-decoration: none;}
    a:hover{color: #23527c;text-decoration: underline;}
    ```

    ​ 布局容器

    ```html
    .container类 固定宽度,支持响应式布局的容器
    .container-fluid类 100%宽度,占据整个窗口的容器
    ```

    ## 三、全局CSS样式

    ​ 栅格系统

    - 栅格 原理及使用
    - 栅格的设置:列偏移、列排序、列嵌套

    ​ 排版

    ​ 代码

    ​ 表格

    ​ 表单

    ​ 按钮、图片

    ​ 辅助类、响应式工具

    ## 四、组件

    ​ 字体图标、下拉菜单、按钮组

    ​ 按钮式下拉菜单

    ​ 输入框组、导航、导航条

    ​ 路径导航、分页、标签、徽章

    ​ 巨幕、警告框、面板

    ## 五、JavaScript插件

    ​ 模态框插件

    ​ 滚动监听插件

    ​ 标签页插件

    ​ 工具提示插件

    ​ 弹出框插件

    ​ 折叠插件

    ​ 轮播插件

    ## 六、补充

    ​ BootstrapValidator表单校验插件















    勤学似春起之苗,不见其增,日有所长; 辍学如磨刀之石,不见其损,日所有亏!
  • 相关阅读:
    Oracle数据库中truncate命令和delete命令的区别
    数组中只出现一次的数字
    数对之差的最大值
    SQL Server: Difference Between Locking, Blocking and Dead Locking
    字符串处理
    Phpcms_V9任意文件上传
    最初的梦想
    陪你走过漫长岁月
    基于MitM的RDP降级攻击
    CVE-2017-0358
  • 原文地址:https://www.cnblogs.com/qiaozhiming123/p/14112005.html
Copyright © 2011-2022 走看看