全屏CSS,最小尺寸 [英] Full screen CSS with minimum size

查看:84
本文介绍了全屏CSS,最小尺寸的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在CSS / HTML中创建了一个具有以下结构的布局:



页脚导航水平滚动显示两个不同的屏幕。屏幕内容是固定的高度,垂直居中,布局总是填满整个窗口。



因为我的内容有一个固定的高度,我需要浏览器显示一个垂直滚动条当窗户达到一定高度时。



我也有几个 position:fixed < canvas> < code>< html>< / code>和< code>< body> 元素,这些元素被设置为高度:100%;宽度:100%



我希望通过在< body>上设置 min-height:700px 选择器当窗口太短时,我可以得到一个滚动条。这似乎不是工作。



如何在通常情况下全屏显示此网站,但在低于最小尺寸阈值时滚动?

解决方案

试试这个: overflow-x:auto;



一旦内容超出其容器大小,请放置一个水平滚动条。


I have created a layout in CSS/HTML with the following structure:

Navigation in the footer scrolls the content horizontally to show two different screens. The screen content is fixed height and vertically centered and the layout always fills the entire window.

Because my content has a fixed height, I need the browser to display a vertical scrollbar when the window reaches a certain height.

I also have a couple of position:fixed <canvas> overlays that get cropped by the <html> and <body> elements which are set to height:100%; width:100%.

I hoped that by setting min-height:700px on the <body> selector I could get a scrollbar to appear when the window got too short. This doesn't seem to be work.

How can I make this website generally full-screen but scroll when below a minimum size threshold?

解决方案

Try this: overflow-x: auto;

It will try to put a horizontal scroll bar once the content exceeded the size of its container.

这篇关于全屏CSS,最小尺寸的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆