Bootstrap Material 基本環境設定

Material Design for Bootstrap 引用元件及初始化. 官網：http://fezvrasta.github.io/bootstrap-material-design/

by Shang-De You

HTML

<!--元件網址是從官網原始碼裡取得的，非公開連結僅測試用，勿放到正式網站內-->
<link href="//pingendo.github.io/pingendo-bootstrap/themes/default/bootstrap.css" rel="stylesheet" type="text/css">
<link href="https://fezvrasta.github.io/bootstrap-material-design/dist/css/roboto.min.css" rel="stylesheet">
<link href="https://fezvrasta.github.io/bootstrap-material-design/dist/css/material-fullpalette.min.css" rel="stylesheet">
<link href="https://fezvrasta.github.io/bootstrap-material-design/dist/css/ripples.min.css" rel="stylesheet">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="//netdna.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>      
<script src="https://fezvrasta.github.io/bootstrap-material-design/dist/js/ripples.min.js"></script>
<script src="https://fezvrasta.github.io/bootstrap-material-design/dist/js/material.min.js"></script>

<!--測試按鈕效果-->
<p class="bs-component">
            <a href="javascript:void(0)" class="btn btn-default">Default</a>
            <a href="javascript:void(0)" class="btn btn-primary">Primary</a>
            <a href="javascript:void(0)" class="btn btn-success">Success</a>
            <a href="javascript:void(0)" class="btn btn-info">Info</a>
            <a href="javascript:void(0)" class="btn btn-warning">Warning</a>
            <a href="javascript:void(0)" class="btn btn-danger">Danger</a>
            <a href="javascript:void(0)" class="btn btn-link">Link</a>
        </p>

JavaScript

$(document).ready(function() {
                // This command is used to initialize some elements and make them work properly
                $.material.init();
            });