Bootstrap

规则

一、响应式布局

　　@media

二、图标、字体

　　@font-face

三、基本使用

实例：

<!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="bootstrap-3.3.7-dist/css/bootstrap-theme.css">

</head>

<body>

    <div class="btn-group" data-toggle="buttons">

      <label class="btn btn-primary active">

        <input type="checkbox" autocomplete="off" checked> Checkbox 1 (pre-checked)

      </label>

      <label class="btn btn-primary">

        <input type="checkbox" autocomplete="off"> Checkbox 2

      </label>

      <label class="btn btn-primary">

        <input type="checkbox" autocomplete="off"> Checkbox 3

      </label>

    </div>

    <script src="jquery-1.12.4.js"></script>

    <script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>

</body>

</html>

bxslider（轮播图）

实例：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" href="jquery.bxslider/jquery.bxslider.css">

</head>

<body>

    <ul class="bxslider">

      <li><img src="data:images/pic1.jpg" /></li>

      <li><img src="data:images/pic2.jpg" /></li>

      <li><img src="data:images/pic3.jpg" /></li>

      <li><img src="data:images/pic4.jpg" /></li>

    </ul>

    <script src="jquery-1.12.4.js"></script>

    <script src="jquery.bxslider/jquery.bxslider.js"></script>

    <script>

        $(document).ready(function(){

            $('.bxslider').bxSlider();

        });

    </script>

</body>

</html>

Bootstrap&bxslider的更多相关文章

  1. jquery使用案例

    表单验证 Dom实现表单验证 通过在form标签的submit上绑定一个onclick事件,用户点击事,触发这个事件,执行Checkvalid()函数进行对表单中的元素值验证,验证通过之后,继续让su ...

  2. HTML、CSS和JS

    一.html 1.web流程中的HTML HTML---->赤裸裸的人 CSS  ---->穿华丽的衣服 JS    ---->让人动起来 浏览器和server端之间的通信本质上是字 ...

  3. 第五篇、css补充二

    一.内容概要 1.图标 2.目录规划 3.a标签中的img标签在浏览器中的适应性 4.后台管理系统设置 5.边缘提示框 6.登录页面图标 7.静态对话框 8.加减框 补充知识: line-height ...

  4. web 前端2 html css一些小问题技巧

    html css一些小问题技巧 1 对于儿子块float后,父亲块如果没内容就不见了,如何让父亲块依然跟随飘起了的儿子块撑起来呢?? 用到的属性after方法  公共方法作为继承即可. 1.1  方法 ...

  5. 【html、CSS、javascript-5】css应用场景补充

    一.CSS全局应用 父标签div下包含两个子标签div,当子标签dvi全部向左float,此时父标签设置的背景色是不显示的 <!DOCTYPE html> <html lang=&q ...

  6. python_way day17 html-day3 前端插件（fontawsome，easyui，bootstrap，jqueryui，bxslider，jquerylazyload），web框架

    python_way day17 一.模板插件 图标的插件 fontawsome: 后台管理: easyui jqueryui 很多网站都会用: bootstrap :引入jQuery:(2.x,1. ...

  7. BootStrap、jQuery UI、bxSlider组件使用

    组件的使用 首先需要将组件下载下来放在统同级目录下 导入组件 使用组件 BootStrap 示例: <!DOCTYPE html> <html lang="en" ...

  8. 【html、CSS、javascript-13】前端框架Bootstrap

    1.Bootstrap前端框架:包含css样式.js插件.图标等 http://www.bootcss.com/ 2.Font Awesome:非常全的图标大全 https://fontawesome ...

  9. 旺财速啃H5框架之Bootstrap（五）

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

随机推荐

  1. django-dailyfresh

    Hold on ,learn by myself! redis nosql - 不支持sql语法 - 存储数据都是KV形式 - Mongodb - Redis - Hbase hadoop - Cas ...

  2. 【BZOJ1202】【HNOI2005】狡猾的商人

    查分约束好,好写好调好AC! 原题: 刁姹接到一个任务,为税务部门调查一位商人的账本,看看账本是不是伪造的.账本上记录了n个月以来的收入情况,其中第i 个月的收入额为Ai(i=1,2,3...n-1, ...

  3. 深入浅出Node.js---Connect模块解析 。转载

    文章地址:https://blog.csdn.net/zhangyuan19880606/article/details/51509205 1 Connect模块背景 Node.js的愿望是成为一个能 ...

  4. SQL Server 并发死锁解决案例备忘

    SET @sql = ' SET TRANSACTION ISOLATION LEVEL REPEATABLE READ; SET DEADLOCK_PRIORITY 10 BEGIN TRAN DE ...

  5. sqler sql 转rest api 源码解析（四）macro 的执行

    macro 说明 macro 是sqler 的核心,当前的处理流程为授权处理,数据校验,依赖执行(include),聚合处理,数据转换 处理,sql 执行以及sql 参数绑定 授权处理 这个是通过go ...

  6. Benthos metrcis 说明

    Benthos 按照input, pipeline ,buffer,conditions,ouput 这个几个大类,为我们提供了 方便的分析metrics,支持json 格式同时可以暴露为 stats ...

  7. PADS Logic Ref Des Start Value

    PADS Logic Ref Des Start Value 曾经以为 Mentor 把 PADS Logic 放弃了,没想到还加了一个非常实用的功能. 这个的好处是让元件号可以设置起始编号,方便每一 ...

  8. [转]RPC 框架通俗介绍

    关于RPC 你的题目是RPC(远程过程调用,Remote Procedure Call)框架,首先了解什么叫RPC,为什么要RPC,RPC是指远程过程调用,也就是说两台服务器A,B,一个应用部署在A服 ...

  9. cachecloud安装部署

    项目地址:https://github.com/sohutv/cachecloud # 初始化数据库 默认插入admin超级管理员,用户名admin, 密码:admin 安装mysql yum -y ...

  10. 决策树原理实例（python代码实现）

    决策数(Decision Tree)在机器学习中也是比较常见的一种算法,属于监督学习中的一种.看字面意思应该也比较容易理解,相比其他算法比如支持向量机(SVM)或神经网络,似乎决策树感觉“亲切”许多. ...