簡單標明Bootstrap LESS文件(1)--- bootstrap.less

 Bootstrap的LESS文件夾下存儲着Bootstrap LESS和Minxin源碼。乍看比較繁複,若要在使用中信手拈來,必要過一遍LESS源碼,熟悉框架結構對提升LESS也是有益的。先簡單標記一下「less/bootstrap.less」中引用的LESS文件。git

 

 1 /*!  2  * Bootstrap v3.3.7 (http://getbootstrap.com)  3  * Copyright 2011-2016 Twitter, Inc.  4  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)  5  */
 6 
 7 // Core variables and mixins 
 8 // 引入變量和mixin函數
 9 @import "variables.less";       //Bootstrap變量
10 @import "mixins.less";          //引入Bootstrap mixin工具函數
11 
12 // Reset and dependencies 
13 // 重置元素樣式和依賴關係
14 @import "normalize.less";       //重置元素樣式,統一瀏覽器顯示
15 @import "print.less";           //設置打印樣式
16 @import "glyphicons.less";      //icon圖標
17 
18 // Core CSS
19 // CSS全局樣式
20 @import "scaffolding.less";     //重置元素樣式,統一/增添Bootstrap樣式。(盒模型寬度、字體大小、a鼠標樣式、圖片、sr-only和button)
21 @import "type.less";            //排版
22 @import "code.less";            //代碼
23 @import "grid.less";            //定義柵格系統樣式 (.container,.row和各.col-*-*)
24 @import "tables.less";          //表格 
25 @import "forms.less";           //表單
26 @import "buttons.less";         //定義按鈕基本樣式
27 
28 // Components
29 // 組件
30 @import "component-animations.less"; 31 @import "dropdowns.less";               //下拉按鈕
32 @import "button-groups.less";           //按鈕組
33 @import "input-groups.less";            //表單元素樣式
34 @import "navs.less";                    //導航樣式
35 @import "navbar.less";                  //導航條樣式
36 @import "breadcrumbs.less";             //眉毛連接
37 @import "pagination.less";              //分頁導航
38 @import "pager.less";                   //翻頁 (上一頁、下一頁 .pager,.next,.previous,.disabled)
39 @import "labels.less";                  //標籤
40 @import "badges.less";                  //徽章
41 @import "jumbotron.less";               //巨幕
42 @import "thumbnails.less";              //縮略圖
43 @import "alerts.less";                  //警告框
44 @import "progress-bars.less";           //進度條
45 @import "media.less";                   //媒體對象
46 @import "list-group.less";              //列表組
47 @import "panels.less";                  //面板
48 @import "responsive-embed.less";        //具備響應式特性的嵌入內容
49 @import "wells.less";                   //把 Well 用在元素上,就能有嵌入(inset)的簡單效果。
50 @import "close.less"; 51 
52 // Components w/ JavaScript
53 // JS插件
54 @import "modals.less";                  //對話框樣式
55 @import "tooltip.less";                 //工具提示
56 @import "popovers.less";                //彈出框
57 @import "carousel.less";                //輪播
58 
59 // Utility classes
60 // 實用工具類
61 @import "utilities.less";               //設置浮動,顯示/隱藏,固定定位
62 @import "responsive-utilities.less";    //設置柵格系統中各列顯示/隱藏,打印樣式(col-*-*)
相關文章
相關標籤/搜索