GeneratePress主题如何设置粘性侧边栏
尝试添加此 CSS:
@media(min-width: 769px) {
.both-sidebars .site-content {
display: flex;
}
#left-sidebar, #primary, #right-sidebar {
left: unset;
}
#left-sidebar {
order: -1;
}
.inside-left-sidebar, .inside-right-sidebar {
position: -webkit-sticky;
position: sticky;
top: 100px;
}
}
如果你使用 GP 3.0 与弹性框结构一起使用,只需要以下内容:
/* Stick sidebars */
@media(min-width: 769px) {
/* stick right sidebar */
.inside-right-sidebar,
.inside-left-sidebar {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
}
如果你只想最后一个小部件作为粘性在侧边栏中,只需添加以下css:
/* Stick last widgets in sidebars */
@media(min-width: 769px) {
.inside-right-sidebar,
.inside-left-sidebar {
height: 100%;
}
.inside-right-sidebar .widget:last-child,
.inside-left-sidebar .widget:last-child {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
}
如何只需右侧边栏的最后一个块具有粘性?试试这个 CSS:
.inside-right-sidebar {
height: 100%;
}
.inside-right-sidebar > *:last-child {
position: sticky;
top: 100px;
}