码迷，mamicode.com
首页 > Web开发 > 详细

jQuery---bootstrap的下载使用,栅格(12个格子),轮播图,矢量图字体图标,进度条,选项卡,标签,表达校验

时间：2019-08-21 21:55:04      阅读：122      评论：0      收藏：0      [点我收藏+]

标签：cfa   依赖   布局   最新版   居中   app   item   list   bind   

jQuery---bootstrap的下载使用,栅格(12个格子),轮播图,矢量图字体图标,进度条,选项卡,标签,表达校验

一丶bootstrap的使用

下载资源文件:

bootstrap官网

导入

// 1.导入样式
       <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
      
      
// 2.导入bootstrap的js,依赖jquery,先导入jquer
    <script src="bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
    <script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>


// 3.导入网络资源
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
        
        
    <!--jQuery的导入-->
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

?

二丶栅格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>栅格系统</title>
    <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    <style>
        .col-md-1, .col-md-3, .col-md-5, .col-md-7, .col-md-9, .col-md-11 {
            height: 50px;
            line-height: 50px;
            border: 1px solid mediumaquamarine;
        }

        .col-md-2, .col-md-4, .col-md-6, .col-md-8, .col-md-10, .col-md-12 {
            height: 50px;
            line-height: 50px;
            border: 1px solid red;
        }

        .col-xs-6 {
            height: 50px;
            line-height: 50px;
            border: 1px solid chartreuse;
        }

    </style>
</head>
<body>
<!--
    栅格参数:
        一共占12个格子,
        居中显示

-->
<div class="container">
    <div class="row">
        <div class="col-md-1 text-center">1</div>
        <div class="col-md-1 text-center">2</div>
        <div class="col-md-1 text-center">3</div>
        <div class="col-md-1 text-center">4</div>
        <div class="col-md-1 text-center">5</div>
        <div class="col-md-1 text-center">6</div>
        <div class="col-md-1 text-center">7</div>
        <div class="col-md-1 text-center">8</div>
        <div class="col-md-1 text-center">9</div>
        <div class="col-md-1 text-center">10</div>
        <div class="col-md-1 text-center">11</div>
        <div class="col-md-1 text-center">12</div>
    </div>
    <div class="row">
        <div class="col-md-2 text-center">1</div>
        <div class="col-md-2 text-center">2</div>
        <div class="col-md-2 text-center">3</div>
        <div class="col-md-2 text-center">4</div>
        <div class="col-md-2 text-center">5</div>
        <div class="col-md-2 text-center">6</div>
    </div>
    <div class="row">
        <div class="col-md-3 text-center">1</div>
        <div class="col-md-3 text-center">2</div>
        <div class="col-md-3 text-center">3</div>
        <div class="col-md-3 text-center">4</div>
    </div>

    <!--从堆叠到水平排列-->
    <div class="row">
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
    </div>
    <div class="row">
        <div class="col-md-8">.col-md-8</div>
        <div class="col-md-4">.col-md-4</div>
    </div>
    <div class="row">
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
    </div>
    <div class="row">
        <div class="col-md-6">.col-md-6</div>
        <div class="col-md-6">.col-md-6</div>
    </div>


    <!--    流式布局容器 -->
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-6">流式布局容器</div>
            <div class="col-md-6">流式布局容器</div>
        </div>
    </div>
</div>


<!--移动设备和桌面屏幕: 响应式-->

<div class="row">
    <div class="col-xs-12 col-md-8">响应式</div>
    <div class="col-xs-6 col-md-4">响应式</div>
</div>

<!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->
<div class="row">
    <div class="col-xs-6 col-md-4">响应式</div>
    <div class="col-xs-6 col-md-4">响应式</div>
    <div class="col-xs-6 col-md-4">响应式</div>
</div>

<!-- Columns are always 50% wide, on mobile and desktop -->
<div class="row">
    <div class="col-xs-6">响应式</div>
    <div class="col-xs-6">响应式</div>
</div>

<!--手机、平板、桌面-->
<div class="row">
    <div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
    <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>
<div class="row">
    <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
    <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
    <!-- Optional: clear the XS cols if their content doesn't match in height -->
    <div class="clearfix visible-xs-block"></div>
    <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
</div>


<!--  多余的 列 -->
<div class="row">
    <div class="col-xs-9">.col-xs-9</div>
    <div class="col-xs-4">.col-xs-4<br>Since 9 + 4 = 13 &gt; 12, this 4-column-wide div gets wrapped onto a new line as
        one contiguous unit.
    </div>
    <div class="col-xs-6">.col-xs-6<br>Subsequent columns continue along the new line.</div>
</div>


<!-- 列偏移 -->
<div class="row">
    <div class="col-md-12">列偏移</div>
    <div class="col-md-4">.col-md-4</div>
    <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div>
</div>
<div class="row">
    <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div>
    <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div>
</div>
<div class="row">
    <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div>
</div>


</body>
<script src="bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</html>

三丶轮播图

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css">
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <!-- Indicators -->
                <ol class="carousel-indicators">
                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                </ol>

                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                    <div class="item active">
                        <img src="http://www.xiaohuar.com/images/banner/2.jpg" alt="...">
                        <div class="carousel-caption">
                            笑话网
                        </div>
                    </div>
                    <div class="item">
                        <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1566317544663&di=556c109264dff8e21a6a6a7154cfa16b&imgtype=0&src=http%3A%2F%2Fpic65.nipic.com%2Ffile%2F20150429%2F20318013_105209450000_2.jpg"
                             alt="时光旅行">
                        <div class="carousel-caption">
                            时光旅行
                        </div>
                    </div>
                    <div class="item">
                        <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1566317544670&di=1e2e67d8453e9ec67893e8f13ee5f710&imgtype=0&src=http%3A%2F%2Fpic2.16pic.com%2F00%2F54%2F93%2F16pic_5493004_b.jpg"
                             alt="开学季">
                        <div class="carousel-caption">
                            开学季
                        </div>
                    </div>

                </div>

                <!-- Controls -->
                <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
            </div>
        </div>
    </div>
</div>
</body>
<script src="../bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</html>

四丶矢量字体图标

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="font_dxgohix8u0r/iconfont.css">

    <style>
        .glyphicon,.iconfont , .fa{
            font-size: 50px;
            color: pink;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <!--    bootStrap 矢量字体图        -->
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
            <!--    阿里矢量库 矢量字体图        -->
            <span class="iconfont icon-fangshai"></span>
            <!--    awesome 矢量字体图        -->
            <span class="fa fa-id-card"></span>


        </div>
    </div>
</div>
</body>
<script src="bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</html>

五丶进度条

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css">
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <!--默认样式的进度条-->
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                     style="width: 60%;">
                    <span class="sr-only">60% Complete</span>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <!--            带有提示标签的进度条-->
            <!--将设置了 .sr-only 类的 <span> 标签从进度条组件中移除 类，从而让当前进度显示出来。-->
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                     style="width: 60%;">
                    60%
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <!--            在展示很低的百分比时，如果需要让文本提示能够清晰可见，可以为进度条设置 min-width 属性。-->
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
                     style="min-width: 2em;">
                    0%
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100"
                     style="min-width: 2em; width: 2%;">
                    2%
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
                     style="min-width: 2em;">
                    0%
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100"
                     style="min-width: 2em; width: 2%;">
                    2%
                </div>
            </div>

            <!--            根据情境变化效果-->
            <!--            进度条组件使用与按钮和警告框相同的类，根据不同情境展现相应的效果。-->
            <div class="progress">
                <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0"
                     aria-valuemax="100" style="width: 40%">
                    <span class="sr-only">40% Complete (success)</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0"
                     aria-valuemax="100" style="width: 20%">
                    <span class="sr-only">20% Complete</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0"
                     aria-valuemax="100" style="width: 60%">
                    <span class="sr-only">60% Complete (warning)</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0"
                     aria-valuemax="100" style="width: 80%">
                    <span class="sr-only">80% Complete (danger)</span>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <!--            条纹效果:-->
            <div class="progress">
                <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar"
                     aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                    <span class="sr-only">40% Complete (success)</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="20"
                     aria-valuemin="0" aria-valuemax="100" style="width: 20%">
                    <span class="sr-only">20% Complete</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar"
                     aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
                    <span class="sr-only">60% Complete (warning)</span>
                </div>
            </div>
            <div class="progress">
                <div class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" aria-valuenow="80"
                     aria-valuemin="0" aria-valuemax="100" style="width: 80%">
                    <span class="sr-only">80% Complete (danger)</span>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <!-- 动画效果 :.progress-bar-striped 添加 .active 类-->
            <div class="progress">
                <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="45"
                     aria-valuemin="0" aria-valuemax="100" style="width: 45%">
                    <span class="sr-only">45% Complete</span>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <!--堆叠效果: .progress 中-->
            <div class="progress">
                <div class="progress-bar progress-bar-success" style="width: 35%">
                    <span class="sr-only">35% Complete (success)</span>
                </div>
                <div class="progress-bar progress-bar-warning progress-bar-striped" style="width: 20%">
                    <span class="sr-only">20% Complete (warning)</span>
                </div>
                <div class="progress-bar progress-bar-danger" style="width: 10%">
                    <span class="sr-only">10% Complete (danger)</span>
                </div>
            </div>

        </div>
    </div>
</div>
</body>
<script src="../bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.js"></script>
</html>

六丶选项卡

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css">
    <style>
        .col-md-12 {
            margin-top: 100px;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <button type="button" class="btn btn-default" data-container="body" data-toggle="popover"
                    data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
                Popover on 左侧
            </button>

            <button type="button" class="btn btn-default" data-container="body" data-toggle="popover"
                    data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
                Popover on 顶部
            </button>

            <button type="button" class="btn btn-default" data-container="body" data-toggle="popover"
                    data-placement="bottom" data-content="Vivamus
sagittis lacus vel augue laoreet rutrum faucibus.">
                Popover on 底部
            </button>

            <button type="button" class="btn btn-default" data-container="body" data-toggle="popover"
                    data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
                Popover on 右侧
            </button>
        </div>
        <div class="col-md-12">
            <div style="padding:100px">

                <a tabindex="0" class="btn btn-lg btn-danger" role="button" data-toggle="popover" data-trigger="hover"
                   title="Dismissible popover"
                   data-content="And here's some amazing content. It's very engaging. Right?">可消失的弹出框</a>

                <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left"
                        title="Tooltip on left" data-trigger="click">Tooltip on left
                </button>

                <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top"
                        title="Tooltip on top">Tooltip on top
                </button>

                <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom"
                        title="Tooltip on bottom">Tooltip on bottom
                </button>

                <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right"
                        title="Tooltip on right">Tooltip on right
                </button>
            </div>
        </div>
    </div>
</div>
</body>
<script src="../bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>
    $(function () {
        $('[data-toggle="popover"]').popover()
        $('[data-toggle="tooltip"]').popover()
    })
</script>
</html>

七丶标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css">
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div>

                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                    <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab"
                                                              data-toggle="tab">Home</a></li>
                    <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a>
                    </li>
                    <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a>
                    </li>
                    <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a>
                    </li>
                </ul>

                <!-- Tab panes -->
                <div class="tab-content">
                    <div role="tabpanel" class="tab-pane active" id="home">111</div>
                    <div role="tabpanel" class="tab-pane " id="profile">222</div>
                    <div role="tabpanel" class="tab-pane" id="messages">333</div>
                    <div role="tabpanel" class="tab-pane" id="settings">444</div>
                </div>

            </div>
        </div>
    </div>
</div>
</body>
<script src="../bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>
    $('#myTabs a').click(function (e) {
        e.preventDefault()
        $(this).tab('show')
    })
</script>
</html>

八丶表单校验

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7-dist/css/bootstrap.css">
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <form>
                <div class="form-group  has-feedback">
                    <label for="exampleInputEmail1">Email address</label>
                    <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
                    <span class="glyphicon  form-control-feedback" aria-hidden="true"></span>

                </div>
                <div class="form-group  has-feedback">
                    <label for="exampleInputPassword1">Password</label>
                    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
                    <span class="glyphicon  form-control-feedback" aria-hidden="true"></span>
                </div>
                <div class="form-group">
                    <label for="exampleInputFile">File input</label>
                    <input type="file" id="exampleInputFile">
                    <p class="help-block">Example block-level help text here.</p>
                </div>
                <div class="checkbox">
                    <label>
                        <input type="checkbox"> Check me out
                    </label>
                </div>
                <button type="submit" class="btn btn-default">Submit</button>
            </form>
        </div>
    </div>
</div>
</body>
<script src="../bootstrap-3.3.7-dist/js/jquery3.4.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>
    $(function () {
        var flag = false

        $('#exampleInputEmail1').blur(function () {
            var val = $(this).val()
            var res = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/.test(val)
            if (res) {
                //校验成功
                $(this).parent().removeClass('has-error')
                $(this).next().removeClass('glyphicon-remove')
                $(this).parent().addClass('has-success')
                $(this).next().addClass('glyphicon-ok')
                flag = true
            } else {
                //校验失败
                $(this).parent().removeClass('has-success')
                $(this).next().removeClass('glyphicon-ok')
                $(this).parent().addClass('has-error')
                $(this).next().addClass('glyphicon-remove')
            }
        }).focus(function () {
            $(this).triggerHandler('blur')
        }).keyup(function () {
            $(this).triggerHandler('blur')
        });

        $(':submit').click(function () {
            if (flag) {
                alert('登录成功')
                return true
            } else {
                alert('登录失败')
            }
            return false
        })
    })
</script>
</html>

jQuery---bootstrap的下载使用,栅格(12个格子),轮播图,矢量图字体图标,进度条,选项卡,标签,表达校验

标签：cfa   依赖   布局   最新版   居中   app   item   list   bind   

原文地址：https://www.cnblogs.com/dengl/p/11391269.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！