作为网络上的几乎每个人,我都很难让我的侧边栏达到100%的页面填充。
我有一个标题,我想在它下面放一个侧边栏和内容:
---------------------------
- header -
---------------------------
- s - c -
- i - o -
- d - n -
- e - t -
- b - e -
- a -
现场演示:
Questoin:“.login-bg- desktop a img”在桌面上运行良好,max-width设置为100%。但在iPhone6等较窄的设备上,背景图像只是缩放以适应视窗的宽度,这使得它们的高度变得更小。我只将heihgt设置为1%或100%,但它们可缩放到原始大小。我也不知道原因?有没有办法让这些图片的高度与网站的高度相匹配?
我有一个问题的CSS计算返回错误的值为%。
我的想法是创建一个粘性的侧边栏,你首先滚动到最后,然后它会一直留在那里,直到内容结束。当我对div使用绝对高度时,它适用于vh单位,但当我使用%时,它就不起作用了。
.sidebar {
position: sticky;
top: calc(100vh - 100%); <-- does not work
top: calc(100vh - 1600px); <-- works as expected.
}
因此,我可能误解了%在这个上下文中的含义(我的理解是:应用.sidebar类的对象的高度),或者calc()不适合使用?
编辑: