affix: 意思是粘附, 附着, 沾上.
因此, 附加導航就是 bootstrap的 Affix.js組件.
bootstrap的 附加導航, 不是說導航分成主導航, 或者什么 副導航的 而是指, 這個導航欄 會"粘帖"在頁面的某個豎直位置, 實現頁面錨點 + 滾動監聽的 效果.
類樣式選擇器的子集: 注意區別兩個類之間 有空格 和 沒有空格, (兩個類緊密挨着沒有空格)的方式, 后者表示類選擇器的子集, 即 元素的class樣式類中, 同時有多個類的時候, 可以根據其中類的子集(同時選出兩個類)來選中元素. 如:
<div class="left carousel-control active">
<style>
.left.
</style>
總之, 不管是類選擇器, 還是id, 還是標簽等, 只要中間加了空格, 就是層級選擇器, 要想多個選擇器同時生效/限定, 就將它們緊挨着/緊密的寫在一起, 如div.left, div#id.carousel.foo 等都是這樣的例子
列表組導航, list-group>list-group-item, 左邊是列表組, 里面的li都是a, 單擊時, 右邊是顯示具體的內容. 但是, 這個內容的顯示, 不是像metronic或Ace那樣的后台管理系統, 而是要刷新整個 頁面的, 重載整個頁面的...
附加導航:開始的時候， 也是隨着其他內容一起移動 只是在某個位置時, 才開始固定不動, 並在導航條上監聽滾動.
附加插件 Affix插件. 跟導航插件 nav. 兩者之間並不是 必然聯系的! 因為:
-
對於Affix插件來說, 任何元素都可以成為Affix, 如div, ul, form等等都是, 只要給他添加了data-spy="affix", data-offset-top="100"等屬性就好了. 它的作用 只是切換元素的滾動和固定狀態. 其中, data-offset-top 或者
.affix({offset: {top: 100}});只是為了在頁面滾動到某個位置的時候, (該元素距離頂端為data-offset-top距離大小時, 切換固定和滾動狀態) -
只是說, Affix插件通常和 nav結合使用, 為了監視nav的滾動, 通常, Affix還要和滾動監聽 結合使用. 通過在 body上寫data-spy="scroll"....屬性.
-
要想得到圖片/視頻等和文本等元素 相混排的 對象, 可以使用 bootstrap中的 "媒體對象" 組件. 一個媒體對象組件, 就是包含在一個div.media中的, 然后左邊的圖片等多媒體 使用div.media-left.media-middle /bottom (默認的圖片對齊方式是頂對齊, 不用寫! ), 中間包含的是一個 a href=...>img.media-object (注意圖片等的樣式類是 :ｍｅｄｉａ－object) 右邊的內容是 div.media-body> h2.media-heading ... + p...
媒體對象組件, 還可以用ul>li>div.media 的方式組成多個媒體對象.
在emmet中, lipsum單獨就可以展開成假文, 所以不必借助於,其他標簽,或 大於符號, 如果要產生多個段落, 直接用 lipsum*4 (n) 就可以了 一個技巧: 在有多個類似的結構時, 可以先寫出 emmet的縮寫形式, "先復制出多個"! 然后再來展開! 而不是展開后再來復制!!! 那樣就比較麻煩了!!
關於vim用等號 = 無法實現縮進格式的自動排版 問題!?
原理: vim要實現 代碼的等號自動縮進 , 是根據 文檔的 類型file type, 有一個syntax語法 格式庫,格式代碼參考標准規定, 然后根據這個格式標准來進行縮進的, 所以, 如果vim的syntax沒有 那種文件類型的 縮進標准 則無法進行縮進, 比如, 默認的就沒有php語言, php文件格式的縮進標准, 因此, 就不能進行縮進, 單擊等號就不能實現格式重拍, 把文件類型改成 html類型, 就能夠實現代碼的格式的自動縮進和重拍了, 因此, 如果沒有必須必要的話, 就盡量不要寫成php, 而寫成html文件格式!
vim的縮進線插件?
有兩個: vim-indent-guide 和 Indentline
在使用vim進行編程的時候, 為了進行行尾控制, 復制/選擇多行, 縮進線的顯示時 , 都需要進行設置 不要換行: set nowrap 這樣會使得整個文檔的長度 變得很清爽, 不會像自動換行時, 那么凌亂!
在設置 多種模式下的 非遞歸 按鍵映射: 直接使用 :noremap
在vim配置中的 <leader>sj 等, leader表示的究竟是什么: 原來, leader表示的是vim的 映射引導鍵! 即只要在 /etc/vimrc中設置: ‵let mapleader='' ‵, 那么以后你安裝插件時, 設置的toggle等快捷鍵, 就可以很方便地用 <leader>xx 來映射鍵了, 這樣的話, 又可以大大的擴展了 使用映射按鍵的范圍了, 以后插件啟動/關閉的 切換鍵映射, 就用 這個<leader>+插件的中文拼音首字母縮寫 來表示了!
解決Affix附加導航不生效的原因
-
左邊的那個 "附加導航"的 "窄豎條" 一定要 寫成 導航組件 ,
ul.nav.nav-pills.nav-stacked, 名字都叫 附加 "導航", 所以一定要是一個 導航, 不能是 列表組 -
一定要在導航的li下的a中設置 跟右邊內容 相一致的 id和錨點 href超鏈接
-
data-spy="affix"... 這些屬性 寫在什么地方? 根據 "自描述"的概念, 屬性是自己描述自己的, 是自己說明自己的, 因此 要設置為affix的 元素是 導航 ul元素 ,因此, 這些屬性 data-spy="affix", data-offset-top="60" data-offset-bottom="200" 等之類 的要寫在導航條 ul 自身上 . 而不是右 下 邊的 滾動內容上!
-
只需要一個屬性: data-spy="affix" 就可以實現元素的 粘附" 附加" 不動了. 但是默認的位置 是固定在 "頁面的中間, 頁面的一半 "的地方
-
Affix元素的位置: 它的初始位置, 由: data-offset-top: xxx 來決定. 然后, 當滾動時 要定位時, 它的位置 由 .affix這個類來決定, 因此要在頂部的 style中 , 另外寫上.affix的類的樣式:
.nav.nav-pills.affix { top: 100px; (如果要控制底部的位置, 使用 bottom: 20px;) } 之類的內容!這個就是文檔中所說的, affix 在三個類: .affix-top, .affix, .affix-bottom 之間進行切換的含義. -
除了對ul導航使用 data屬性來使他成為 affix 之外, 還可以使用 js代碼實現:
$('ul導航的id').affix({
offset{
top: 100px; 之類的數字....
}
});