我有一个固定在页面顶部的流体图像 width: 100%
。当用户向下滚动页面时,文本会在图像上滚动。查看此 jsfiddle 以获得 demo和我的 code .这就是我想要发生的事情。
我遇到的问题是当用户还没有滚动(即在页面加载时)并且浏览器是一定宽度时,图像没有被页面文本清除(页面文本与图像重叠)。如何确保我的页面文本在所有屏幕尺寸下都能清晰显示图像?
最佳答案
如果我没看错,你想在图像和文本之间设置一个间隙。当您使用 fixed
定位元素时或 absolute
你从普通元素网格中取出它。如果你想在视觉上分离标题图像和文本,请添加 micro clearfix至 <content>
并设置 padding-top
它等于图像高度。参见 example
希望对您有所帮助!
关于html - 如何让页面元素在屏幕尺寸不同时清晰显示固定到顶部的流体图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23854157/