固定宽度内实现内容瀑布流，实现错落有致感，引入jaliswall.js

html结构：

  @Power.ArticleList("文章图片列表-无裁剪", new { Node = "***", Count= 12, Illustrated = true, TitleLength = 56, ShowDate= true, DateFormat ="yyyy-MM-dd", ShowNode= true , Sort="Priority,PublishTime"})

引入jaliswall.js后，会把标签读取的内容分割成N*wall-column列区块，分割的列（wall-column），在css中设置width值的百分比是指瀑布流分几列展示，比如25%，就是一共4列显示，如下图，需要其它列数效果，调整百分比很快即可实现，不需要考虑间距的占比，间距需要在wall-column 内单独起样式控制。

.pic-list-pbl .wall-column { width: 25%; float: left; }

系统文章图片列表有裁剪效果的，在这里不适用，需要原图无裁剪，才能更好的展示实际效果。这里把标签的图片裁剪参数去掉，然后重新命名，避免展示图片因裁剪出现模糊或比例不对问题，图片获取代码部分修改后如下。

@if (string.IsNullOrEmpty(Model.FeaturedImage))
     {
         
      }
      else
     {
      
      }

整体效果样式不多述，预览站点：，通过以上几个步骤就可实现内容排序是横向1-2-3-4形式展示的瀑布流布局。

标签和js压缩包下载