如何创建一个响应边栏，在断点上的内容下？

Question

在我有侧边栏的那一刻。 现在它必须在内容下去 当你打开窗户时，你会遇到一个断点 你的浏览器更小。

这是我的css：

aside{

width:20%;
float: right;
background-color: #B8B8B8;
margin-top: 2.8em;
margin-left: -1em;
text-decoration: none;
}   

我的其他内容的宽度为 79％并向左浮动。

有人知道如何在内容下方设置我的侧边栏 我让我的窗口缩小了浏览器。所以侧边栏必须有响应 当你在智能手机上看到我的网站时。

Answer 1

使用媒体查询

@media screen and (max-width: BREAKPOINT){
   aside, content{
     width: 100%;
     float: none;
   }
}

请确保侧边栏位于HTML内容的下方，并且可以正常工作