bootstrap 最简单母版
2016-10-13 16:17:43 ISaiSai 阅读数 2305
<div class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
        下拉
    </a>
    <ul class="dropdown-menu">
        <li>a</li>
        <li>b</li>
        <li>c</li>
        <li>d</li>
    </ul>
</div>
2019-02-13 16:36:38 it_all 阅读数 80
npm i jquery
npm i bootstrap

在main.js中

import 'jquery/dist/jquery.min'
import 'bootstrap/dist/css/bootstrap.css'

这样就可以生效了,不用网上别人那么繁琐

2018-10-23 19:15:00 weixin_34290390 阅读数 2
<%--loading遮罩层--%>
<div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">
      <div style="width: 200px;height:20px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-10px">
        <div class="progress progress-striped active" style="margin-bottom: 0;">
          <div class="progress-bar" style="width: 100%;"></div>
        </div>
        <h5 id="loadText">loading...</h5>
      </div>
</div>
<%--loading方法--%>
<script type="text/javascript">
    var loadingTime= 5;//默认遮罩时间
    showLoading = function (loadText) {
        if(!loadText){
            $("#loadText").html(loadText)
        }
        $('#loadingModal').modal({backdrop: 'static', keyboard: false});
    }
    hideLoading = function () {
        $('#loadingModal').modal('hide');
    }
</script>

 

转载于:https://my.oschina.net/iyinghui/blog/2251435

2017-02-17 09:58:54 weixin_37510612 阅读数 1017

<html> //最简单的鼠标悬停,实现下拉功能,应用bootstrap框架的知识,不会bootstrap自己百度怎么使用
    <head>
        <meta charset="UTF-8">
            <!-- 引入 Bootstrap -->
      <link href="../css/bootstrap.min.css" rel="stylesheet">
          <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
        <script src="../libs/jquery-1.11.1.js"></script>
        <script src="../js/bootstrap.min.js"></script>
        <title></title>
    </head>
    <body>

<div class="dropdown" >
            <span class="dropdown-toggle"  data-toggle="dropdown" data-target="#" >触发器</span>
              <ul class="dropdown-menu" >
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
            </ul>
        </div>
        <script>
            $(document).ready(function(){
                $("span").hover(function(){//鼠标悬停触发事件
                $(".dropdown-toggle").dropdown('toggle');
                });
            });
        </script>
    </body>
</html>

2019-01-17 11:18:54 Bian_MCheng 阅读数 48

Java开发交流群 677807540   大家可以一起讨论技术欢迎加入  (需要js可以加群下载)

1.引入js

<script type="text/javascript" src="${basePath }js/laydate/laydate.js"></script>

2.直接页面初始化加载就ok了

$(function() {              
     
        //常规用法
         laydate.render({
           elem: '#startTime'    //这里直接填写  id就可以了
         });

 

});

3:各种显示

  1. //年选择器
  2. laydate.render({
  3. elem: '#test2'
  4. ,type: 'year'
  5. });
  6. //年月选择器
  7. laydate.render({
  8. elem: '#test3'
  9. ,type: 'month'
  10. });
  11. //时间选择器
  12. laydate.render({
  13. elem: '#test4'
  14. ,type: 'time'
  15. });
  16. //时间选择器
  17. laydate.render({
  18. elem: '#test5'
  19. ,type: 'datetime'
  20. });

bootstrap简单介绍

阅读数 1248

bootstrap 是最初級的引導,旨在初始化CPU,簡單時鐘,堆椎,目標是讓CPU處於可以正常運行\r 咱通常說的uboot那樣的bootloader實際上是集成了很多功能及驅動的程式,如串口,網絡等,目的是為加載和調試kernel創建一個良好環境基于ARM的嵌入式系统的启动都需要引导程序,引导过程可以有两种,一种是先运行小型的bootstrap完成所谓的lo

博文 来自: beishafengjiang

bootstrap简单的页面布局

阅读数 1173

1.布局结构(头部固定,内容分为左右结构)2.结果展示3.HTML代码&lt;divclass="logo"&gt;logo&lt;/div&gt;&lt;divclass="container-fluid"&gt;&lt;divclass="rowmain"&gt;&lt;divclass=&quo

博文 来自: cxzlp12345

bootstrap的简单实用

阅读数 349

bootstrap的具体使用方法bootstrap其实是把网页等分为了12分栅格参数bootstrap把根据屏幕大小把屏幕分为了4个层级超小屏幕小屏幕中等屏幕大屏幕栅格参数,我们看下下面这幅图:每行的数字全部相加,最终都等于刚刚我让大家记住的12我现在需要在页面上左右分别显示两个面板,面板上面显示相应的表格数据,且左侧列表占总宽度的3分之2,右侧的面板仅占3分之1

博文 来自: github_40094105

bootstrap的简单介绍

阅读数 260

前言打个比方:如果需要做一个ppt,是从空白页开始制作块呢?还是下载一个模板,将图片文字替换进去更快呢?所以使用bootstrap框架的可以速度和效率的生成一个html5网页本文主要针对bootstrap31.如何关联bootstrap1.1下载编译后的bootstrap文档,link标签本地关联1.2引用cdn,如下:&lt;linkhref="https://cdn.bootcss.com/...

博文 来自: HelloImyHe

简单的bootstrap实例

阅读数 381

一个简单的bootstrap-table例子,直接使用网络资源和和浏览器+文本就可以书写出来的实例。&lt;!--引入bootstrap样式--&gt;&lt;linkhref="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css"rel="stylesheet"&gt;&lt;!--引入...

博文 来自: mathew_leung
没有更多推荐了,返回首页