响应2栏交错布局客户期望与现实问题

时间:2019-03-18 作者:Winterain

我们开发并交付了一个Wordpress网站,通过Gutenberg内置的专栏将博客布局分为两列。在桌面上,该网站看起来就像一本杂志,用户按照我随附的图表上的编号,从左栏到右,再从左到右阅读项目。

然而,在mobile中,像往常一样,一整列将堆叠在另一列上,因此顺序是关闭的。

有没有办法做到这一点?在wordpress的博客文章中包含有序的内容,并允许客户端在CMS中创建这些文章。

我知道最明显的方法是使用砖石布局,但据我所知,没有任何主题/插件允许您在有序的砖石块中使用混合媒体输入博客文章。

enter image description here

the problem

1 个回复
SO网友:Winterain

目前,我已经实现了一个可行的解决方案,即将所有内容都作为“平面”无栏帖子输入,这样一来,当客户端输入时,内容的“流”正是它在移动设备上的表现。

在桌面上,我将宽度:50%和砌体插件应用于post body容器的所有直接子元素。

在CSS中的移动断点上,我将子元素宽度设为100%。

目前它运行良好,但与往常一样,某些块高度组合可能会导致意外的布局。

相关推荐

Responsive Admin Themes

我在看这个管理主题的示例(http://themepixels.com/main/themes/demo/webpage/shamcey/dashboard.html). 至于标签为“Navigation”的左侧管理栏,有没有一种方法可以在不使用插件的情况下实现这种类型的左侧仪表板管理菜单?我想用css、js或Jquery来实现这一点,任何处理编码的东西都可以。