zoukankan      html  css  js  c++  java
  • Bootstrap-轮播图-No.1

    <!DOCTYPE html>
    <html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Document</title>
        <link rel="stylesheet" type="text/css" href="../../css/bootstrap.css"/>
        <script src="../../js/jquery-1.11.2.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <!--
            作者:bilaisheng@163.com
            时间:2017-10-16
            描述:bootstrap插件 ,由别人定义好jquery插件技术进行开发,插件是没有办法仅通过CSS就能控制
            而是通过js/jquery 控制. 必须引入jquery/bootstrap.min.js
        -->
    
        <style type="text/css">
            .mt50{margin-top: 50px;}
            .carousel-inner >.item img{width: 100%;height: 300px;}
    
        </style>
        <div class="container mt50"><!--viewport视口 1170px-->
            <div class="carousel slide" data-ride="carousel">
                <div class="carousel-inner">
                    <div class="item active">
                        <img src="http://img-cdn2.luoo.net/site/201710/59df32615f7cf.jpg"/>
                    </div>
                    <div class="item">
                        <img src="http://img-cdn2.luoo.net/site/201710/59db18dd28759.jpg"/>
                    </div>
                    <div class="item">
                        <img src="http://img-cdn2.luoo.net/site/201710/59ddf17c9ce1e.jpg"/>
                    </div>
                </div>
            </div>
        </div>
    
    </body>
    </html>
  • 相关阅读:
    两台电脑间的消息传输
    商品库存订购管理管理程序代写代做代开发
    基于ssh的汽车配件进销存系统
    Ajax初识
    系统排队仿真源代码
    模拟一个排队系统
    Linux下,C++编程论坛题目抽取
    实践是检验真理的唯一标准2 脱壳篇03
    迪杰斯特拉算法
    最短路径求法
  • 原文地址:https://www.cnblogs.com/bilaisheng/p/10210946.html
Copyright © 2011-2022 走看看