H大分享的瀑布流节点样式,鉴于论坛不太好搜索,这里收录一下
瀑布流又称瀑布流式布局,是比较流行的一种网站页面布局方式。视觉表现为参差不齐的多栏布局
使用效果
样式代码
把下面的代码复制到【偏好设置/自定义样式】里
.node[mystyle="瀑布流"] {
> .node-child {
column-count: 3; /*多列的列数*/
column-gap: 15px;/*列间距*/
> .node {
box-shadow: 0 0px 3px 1px rgba(0, 0, 0, 0.15);
break-inside: avoid;
margin-bottom: 15px;
.node-text {
padding-left: 32px !important;
margin-left: 0px !important;
}
}
}
}
下面一版是2列去边框的,个人比较喜欢
.node[mystyle="瀑布流2列"] { > .node-child { column-count: 2; /*多列的列数*/ column-gap: 15px;/*列间距*/ > .node { break-inside: avoid; margin-bottom: 15px; .node-text { padding-left: 32px !important; margin-left: 0px !important; } } } }