zoukankan      html  css  js  c++  java
  • 前端开发工具(插件)

    Bootstrap

      在众多插件中,Bootstrap是用得最多、功能最强大的。Bootstrap是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的,它简洁灵活,使得 Web 开发更加快捷。Bootstrap是基于HTML5和CSS3开发的,它在jQuery的基础上进行了更为个性化的完善,形成一套自己独有的网站风格,并兼容大部分jQuery插件。

      使用时需要在HTML代码的<head></head>标签中导入     文件路径/bootstrap-3.3.7-dist/css/bootstrap.min.css

    <head>
        <meta charset="UTF-8">
        <title>title</title>
        <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    </head>
    

      也可用CDN的形式

    <script src="//cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">

      使用方法详见官网链接:http://v3.bootcss.com/    中文全汉化网站:http://www.bootcss.com/

    FontAwesome

      FontAwesome是一个拥有海量图标的网站,虽然Bootstrap中已经有非常多的图标供我们使用,但仍有捉襟见肘的时刻,FontAwesome可以很好的帮助我们解决图标不够用的问题。同理使用前需下载好文件并进行导入

      FontAwesome中文网:http://www.fontawesome.com.cn/faicons/

    SweetAlert系列

      SweetAlert是一项对原生JS中的alert加以美化的工具,有SweetAlert2和SweetAlert22两个版本。

      现在多用SweetAlert2,下载及教程地址:https://sweetalert2.github.io/   中文:http://mishengqiang.com/sweetalert/

      SweetAlert 到 SweetAlert2 升级指南

      使用前记得引入<script src="sweetalert2/sweetalert2.js"></script>

      也可用CDN形式

    <script src="https://cdn.bootcss.com/sweetalert/2.1.0/sweetalert.min.js"></script>

    Toastr通知

            Toastr

     

    jQueryLazyload懒加载

    示例代码:

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="x-ua-compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <title>懒加载示例</title>
    </head>
    <body>
    <div>
      <div><img src="img/0.jpg" alt="" class="lazy" data-original="img/5.jpg" width="600px" height="400px"></div>
      ...
      <div><img src="img/0.jpg" alt="" class="lazy" data-original="img/6.jpg" width="600px" height="400px"></div>
    
    </div>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="jquery.lazyload.min.js"></script>
    <script>
      $("img.lazy").lazyload({
        effect: "fadeIn",
        event: "click"
      })
    </script>
    </body>
    </html>

    管理后台模板

            Metronic

    Highcharts图像分析

      网址:https://www.hcharts.cn/demo/highcharts

  • 相关阅读:
    第09组 Beta冲刺(3/4)
    第09组 Beta冲刺(2/4)
    第09组 Beta冲刺(1/4)
    第09组 Alpha事后诸葛亮
    王之泰201771010131《面向对象程序设计(java)》第一周学习总结
    正则表达式
    单逻辑运算符和双逻辑运算符的不同之处
    C++11 Java基本数据类型以及转换
    Java中赋值常量的注意事项
    程序命名规则
  • 原文地址:https://www.cnblogs.com/zhuminghui/p/8337730.html
Copyright © 2011-2022 走看看