• Bootstrap框架的学习(一)


    一、Bootstrap框架介绍

    Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架。

    二、简单介绍

    Bootstrap框架是属于UI框架,与Jquery不一样,准确的描述Bootstrap框架属于CSS框架,而非JavaScript框架,但是它本身使用JavaScript来完善Bootstrap框架来完善视觉效果。

    三、优点

    完美的支持H5和CSS3,以及支持移动端浏览器

    四、内容

    可以参考一下官方文档http://v3.bootcss.com/

    (一)脚手架:用于重置背景,链接的样式等,包含两个简单的布局结构。这两个布局系统:默认栅格系统和流式栅格系统。Bootstrap样式使用了lesscss技术,比如:重置背景。我觉得最精彩的部分是栅格系统。

    (1)默认栅格系统:是按照固定的宽度等分,按940px等分。

    (2)流式栅格系统:是按照视图页面进行等分,按12等分。

    (二)基本CSS样式

    Bootstrap给出了常用的HTML元素样式,CSS提供样式很专业很美

    (三)CSS组件

    Bootstrap还提供一些常用的CSS组件

    (四)Js插件

    随意扩展Bootstrap,特别是js框架

    五、版本

    使用较广的是2和3版

    2015年9月,发布了Bootstrap 4alpha版本

    六、css组件

    下拉菜单,按钮组,按钮下拉菜单,导航,导航条

    七、js插件

    自带13个jq插件,包括:对话框,标签页,流动条,弹出框

    八、Bootstrap与JqueryMobile比较

    Bootstrap是跨屏幕分辨率自动适应

    JqueryMobile是专门针对移动端

    九、Bootstrap与Jquery EasyUI比较

    Bootstrap封装性更胜一筹。Bootstrap的表格仅仅使用一个属性可以控制分页,无论是服务器的分页还是客户端分页都可以控制,而且自带查询框。

    EasyUI需要手动去写分页的样式以及查询功能。

  • 相关阅读:
    IDEA导入外部jar包步骤
    将本地新建工程推到git上
    【转】Memcached与Redis有什么区别
    Redis
    JavaScript-Tool-lhgDialog-js:lhgdialog.js
    信息安全-HTTP:HTTP 身份验证
    信息安全-HTTP:HTTP访问控制(CORS)
    JavaScript-Tool-lhgDialog:框架示例
    JavaScript-Tool-lhgDialog:动画示例-源代码
    JavaScript-Tool-lhgDialog:动画示例
  • 原文地址:https://www.cnblogs.com/chengxs/p/5932538.html
Copyright © 2020-2023  润新知