資訊專欄INFORMATION COLUMN
摘要：的組成結構部分包含了，其中部分又包含了幾個部分。代碼如下圖內容展示截圖代碼截圖快捷欄展示截圖代碼截圖頁面底部展示截圖代碼截圖上一篇之模板的學習之路源碼分析之部分下一篇之模板的學習之路源碼分析之腳本部分
body 的組成結構
body 部分包含了 HEADER、CONTAINER、FOOTER，其中 CONTAINER 部分又包含了 SIDEBAR、CONTENT、QUICK SIDEBAR 幾個部分。body部分源碼折疊后截圖如下：
Header 頁面頂部Header contains of logo and top menu bar and it used in all pages.
頁面頂部（或頭部）應用于所有的頁面，包含 logo 、頂部菜單欄等。
代碼如下圖（已折疊，下文同）：
從截圖可見，在 header 結束后，有個 header 和 content 的分割，其 class="clearfix" 主要是清除浮動用，這樣上下兩塊內容就相對獨立，方便布局。
Sidebar 側邊欄Sidebar contains of quick search form and main navigation menu.
側邊欄包含快速搜索和主要的導航菜單。
代碼如下圖：
Content 內容Content consists of page title, breadcrumbs and page"s main body.
展示截圖：
代碼截圖：
Quick Sidebar 快捷欄Quick Sidebar contains of user chat, notifications and general settings form.
展示截圖：
代碼截圖：
Footer 頁面底部展示截圖：
代碼截圖：
上一篇：Bootstrap 之 Metronic 模板的學習之路 - （2）源碼分析之 head 部分
下一篇：Bootstrap 之 Metronic 模板的學習之路 - （4）源碼分析之腳本部分
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/111467.html
摘要：寫在前面的模板非常多，上有著各種各樣的免費及付費模板。概述是一個基于設計的自適應多用途的管理后臺模板。下一篇之模板的學習之路源碼分析之部分 寫在前面 bootstrap 的模板非常多，Envato 上有著各種各樣的免費及付費模板。Metronic 是我最喜歡的模板之一（看一眼就喜歡上的那種），當前售價 $28 ，覺得贊的，不妨支持一下作者。覺得貴的，想必不用我說，你也會找到途徑。:b ...
摘要：修復后得到合法的后在由布局引擎建立相應的對象。在標簽放置于標簽之后時，源碼被所有瀏覽器泛指上常見的修復為正常形式，即。上一篇之模板的學習之路源碼分析之部分下一篇之模板的學習之路主題布局配置 上篇我們將 body 標簽主體部分進行了簡單總覽，下面看看最后的腳本部門。 頁面結尾部分（Javascripts 腳本文件） 我們來看看代碼最后的代碼，摘取如下： ...
摘要：你可以用此模板作為你應用程序的起點。上一篇之模板的學習之路主題布局配置下一篇之模板的學習之路前端自動化工具 前面我們將 Metronic 的結構和源碼大致瀏覽了一遍，Metronic 整個文件包有三百多兆，在實際項目中，我們肯定用不到所有文件，這時，我們需要做一些自定義。 自定義和擴展 CSS 部分 要重載 Metronic 主題的 CSS 樣式，我們可以定制 ../assets/la...
閱讀 2835·2023-04-25 17:59
閱讀 675·2023-04-25 15:05
閱讀 669·2021-11-25 09:43
閱讀 3026·2021-10-12 10:13
閱讀 3532·2021-09-27 13:59
閱讀 3577·2021-09-23 11:21
閱讀 3872·2021-09-08 09:35
閱讀 561·2019-08-29 17:12
