Definition

瀑布流布局,在視覺上表現(xiàn)為參差不齊的多欄布局,隨著頁面滾動條向下滾動,新數(shù)據(jù)不斷被加載進來。

瀑布流對于圖片的展現(xiàn),是高效而具有吸引力的,用戶一眼掃過的快速閱讀模式可以在短時間內(nèi)獲得更多的信息量,而瀑布流里懶加載模式又避免了用戶鼠標點擊的翻頁操作。

瀑布流的主要特性便是錯落有致,于亂中見序,定寬而不定高的設(shè)計讓頁面區(qū)別于傳統(tǒng)的矩陣式圖片布局模式,巧妙的利用視覺層級,視線的任意流動又緩解了視覺疲勞,同時給人以不拘一格的感覺,切中年輕一族的個性化心理。

最早采用此布局的網(wǎng)站是Pinterest,逐漸在國內(nèi)流行開來。

目前主流的布局方式是以下三種:

  1. 傳統(tǒng)的多列浮動:如wap端天貓的搜索結(jié)果頁就是左右兩列浮動布局

  2. 通過絕對定位的方式:如Pinterest。

  3. 使用css3實現(xiàn)。

本文重點討論的是第三種。

Origin

我組負責的搜索結(jié)果頁布局是傳統(tǒng)的格子布局,通過 

延伸閱讀

學習是年輕人改變自己的最好方式-Java培訓,做最負責任的教育,學習改變命運,軟件學習,再就業(yè),大學生如何就業(yè),幫大學生找到好工作,lphotoshop培訓,電腦培訓,電腦維修培訓,移動軟件開發(fā)培訓,網(wǎng)站設(shè)計培訓,網(wǎng)站建設(shè)培訓學習是年輕人改變自己的最好方式