快捷導(dǎo)航

Bootstrap Metronic完全響應(yīng)式管理模板學(xué)習(xí)筆記

更新時間：2024年09月18日 17:19:01 作者：ymnets

這篇文章主要為大家分享了Bootstrap Metronic完全響應(yīng)式管理模板學(xué)習(xí)筆記，感興趣的小伙伴們可以參考一下

學(xué)習(xí)使用Bootstrap Metronic完全響應(yīng)式管理模板，具體內(nèi)容如下

1.簡介

Bootstrap Metronic是一個基于Bootstrap 3.x的高級管理控制面板主題。Bootstrap Metronic - 是一個完全響應(yīng)式管理模板?；贐ootstrap3框架。高度可定制的，易于使用。適合從小型移動設(shè)備到大型臺式機(jī)很多的屏幕分辨率。包含7個主題，高達(dá)100個左右的實例頁面，非常豐富頁面展示效果，包括表單，表格，地圖，日歷…等等。

對比了其他Bootstrap定制的影響式模版，這個功能與插件比較豐富。感覺大同小異如（免費的-AdminLTE）

注：mvc4系列不會升級用metronic

軟件準(zhǔn)備：VS2013

2.資源

7個主題演示地址：http://www.keenthemes.com/preview/metronic/

3.用途和保障

主要用途：一體化的管理模版，構(gòu)建管理系統(tǒng)后臺，如CMS,HR,OA等管理系統(tǒng)必備。花俏的軟件比界面死板的同等軟件價格可賣出高達(dá)40%

能合并到所有語言前端，包括主流asp.net,JSP,PHP

（源源不斷的Bootstrap 和Metronic作為更新技術(shù)支持，除非推兔團(tuán)隊解散）

4.目錄

按目錄名稱可以看出包含了文檔（documentation），資源（resources），開始(start)，主題(theme與theme_trl)，說明readme.txt

打開readme我們可以看到我們只需要用theme這個文件夾即可。theme_rtl支持RTL，RTL顛覆我的編程習(xí)慣。

可以依次運行theme-->templates-->adminX下的index效果?！?/p>

然并沒有，發(fā)現(xiàn)每一個admin對應(yīng)了admin_material_design，根據(jù)readme說明admin_material_design是對應(yīng)AngularJS版本的，不知道說得對不。

不懂AngularJS所以我們只用到正常版本的adminX

以上是部分截圖。右邊的設(shè)置可以設(shè)置布局的方式

把瀏覽器縮小看看平板下的效果同樣非常不錯。

5.總結(jié)

我們只需用到theme下的templates為參照模版。

作者：YmNets
出處：http://ymnets.cnblogs.com/

如果大家還想深入學(xué)習(xí)，可以點擊這里進(jìn)行學(xué)習(xí)，再為大家附兩個精彩的專題： Bootstrap學(xué)習(xí)教程 Bootstrap實戰(zhàn)教程

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

淺談JS中json數(shù)據(jù)的處理
下面小編就為大家?guī)硪黄獪\談JS中json數(shù)據(jù)的處理。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-06-06
Bootstrap CSS布局之表單
這篇文章主要介為大家詳細(xì)紹了Bootstrap CSS布局之表單的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-12-12
echarts圖表設(shè)置寬度100%結(jié)果為100px的解決辦法
在開發(fā)一個前端項目時需要用到Element-ui的el-tabs組件和Echart開源庫,當(dāng)兩者嵌套使用時,我給Echart中的圖表寬度設(shè)置為了100%,但是實際的寬度卻只有100px,這篇文章主要給大家介紹了關(guān)于echarts圖表設(shè)置寬度100%結(jié)果為100px的解決辦法,需要的朋友可以參考下
2022-12-12
js 幻燈片的實現(xiàn)
今天在群里看到有人要幻燈片的代碼，于是我自己也想了想，做個總結(jié)。常見的幻燈片切換無非就是輪播和漸變，不管哪種都是用定時器來逐步改變圖片或者圖片組的某種屬性來實現(xiàn)的
2011-12-12
JavaScript中while循環(huán)的基礎(chǔ)使用教程
這篇文章主要給大家介紹了關(guān)于JavaScript中while循環(huán)的基礎(chǔ)使用教程，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2020-08-08
兩種JS實現(xiàn)屏蔽鼠標(biāo)右鍵的方法
這篇文章主要介紹了兩種JS實現(xiàn)屏蔽鼠標(biāo)右鍵的方法，瀏覽者在訪問你網(wǎng)頁的時候就不能點擊右鍵，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2015-08-08
JavaScript二維數(shù)組實現(xiàn)的省市聯(lián)動菜單
這篇文章主要介紹了使用二維數(shù)組實現(xiàn)的省市聯(lián)動菜單，通過二維數(shù)組存儲城市列表項,需要的朋友可以參考下
2014-05-05
JavaScript計算正方形面積
這篇文章主要為大家詳細(xì)介紹了JavaScript計算正方形面積，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-11-11
使用Axios函數(shù)庫進(jìn)行網(wǎng)絡(luò)請求的操作指南
在現(xiàn)代的前端開發(fā)中,API調(diào)用是實現(xiàn)前后端數(shù)據(jù)交互的重要環(huán)節(jié),而在眾多的HTTP庫中,Axios以其簡潔的語法、豐富的功能和易于擴(kuò)展的特性,成為了開發(fā)者的首選,本篇文章將深入介紹Axios的使用方法,
2024-11-11
JavaScript創(chuàng)建對象的幾種方式小結(jié)
這篇文章主要介紹了 JavaScript 中創(chuàng)建對象的多種方式,包括字面量方式、構(gòu)造函數(shù)方式、原型模式、() 方法、ES6 類,并分別說明了它們的特點和適用場景,強調(diào)在實際編程中要根據(jù)需求選擇合適的方式以提高代碼質(zhì)量和性能,需要的朋友可以參考下
2024-12-12