zoukankan      html  css  js  c++  java
  • Bootstrap框架

    1、设置默认格式

    3、md,sm, xs

     

    4、空格和没有空格的选择器

     

    二、响应式介绍

    - 响应式布局是什么?
      同一个网页在不同的终端上呈现不同的布局等
    - 响应式怎么实现的?
      1. CSS3 media query 媒体查询
      2. JS去控制网页的布局和样式等
        - 缺点:工作量大,网页响应慢
        - 优点: 专治疑难杂症
      3. 用框架
        - Bootstrap

    测试用css 媒体查询实现响应式

    方式一、link.css文件

    主文件中导入link.css文件

    方式二、link2.css文件

    在主文件中导入link2.css文件

     

    三、常用插件

    常用插件基本上都是基于jQuery

      先导入插件的CSS文件

      再导入jQuery文件

      最后导入JS,注意jQuery是必须要放在JS上面的

     1、Sweet Alert(弹出框)

      使用步骤:1下载 2解压找到里面的dist(主要是dist)和animate.css  3引入到自己的文件里就行了
    注:如果是html参数就要用animate
       





    
    

    五、需要知道的几个插件网址

          1、SweetAlert (弹出框):https://github.com/t4t5/sweetalert

       2、SweetAlert2 (弹出框):https://github.com/limonte/sweetalert2

       3、Font Awesome(字体图标):http://fontawesome.io

          4、jQuery lazy load(懒加载):https://github.com/tuupola/jquery_lazyload

          5、Toastr(通知栏):http://codeseven.github.io/toastr/

    六、Bootstrap网址:http://v3.bootcss.com/

          有时间看一下这个网址:http://www.jq22.com/daima

    七、自定义Bootstrap组件,

        1、找到自定义那一页

        2、勾选我用到的组件
        3、拉到最后面,点击下载

    八、Bootstrap补充:

       - modal
       和模态框使用的
       $("#myModal").modal("show")
      - collapse :也是在JavaScript组件中去找,点击按钮有信息出来

    - tooltip : 相当于提示信息,就像是一个按钮,指向按钮会有提示信息
  • 相关阅读:
    Leetcode Binary Tree Preorder Traversal
    Leetcode Minimum Depth of Binary Tree
    Leetcode 148. Sort List
    Leetcode 61. Rotate List
    Leetcode 86. Partition List
    Leetcode 21. Merge Two Sorted Lists
    Leetcode 143. Reorder List
    J2EE项目应用开发过程中的易错点
    JNDI初认识
    奔腾的代码
  • 原文地址:https://www.cnblogs.com/lujiacheng-Python/p/10013799.html
Copyright © 2011-2022 走看看