基本问题
如何将网站设置为宽度:平板电脑设备为100%。
有java脚本选项可以检测屏幕大小并相应地重新调整CSS。如果这是目前唯一可以接受的选项,但肯定会使用HTML5 / CSS3,这是一个更优雅的解决方案。
详细说明:
我并不担心移动设备,因为应用程序非常详细,移动版本必须有更简单的选项。
问题出现了,因为平板电脑现在具有高清晰度。因此,设计一个最大宽度:998px的网站过去没问题,全高清平板电脑不会显示为100%宽度,因为它显然会超过998px。
我已经研究过缩放,但大家一致认为它还没有得到支持。
最后
我应该开始设计我的页面以适应最大宽度:1280px,并使我的表格/表格宽度:100%?
目前我正在使用http://getbootstrap.com/并且令人惊讶,但没有平板电脑检测库。我有不同大小的设备的课程,但它想说,平板电脑=宽度100%。
最后的注释
如果大多数示例都不清楚,请遵循<body><div class="container">...</div></body>
所以我在.container
之后在平板电脑上保持100%的宽度。
我目前100%高达998px,但可能需要将其增加到1200px,反馈也很好。
修改1
我的投票太广了。能否详细说明,因为我在发布之前已经搜索了几周。关于如何创建全宽平板电脑网站的问题很少。如果你想要例子,我可以创建一些页面。问题是这么多不同的决议。例如,我想要一个带有帐户/联系人详细信息的页面或表单,并使其适合任何大小的平板电脑,如果我在50英寸的屏幕上打开页面,如果输入宽度,它将无法工作:百分。为什么限制为最大宽度:998px,以尝试适合大多数桌面。但平板电脑尽管分辨率很高,但它们的屏幕很小,并且看起来非常完整。
答案 0 :(得分:0)
如果您使用的是bootstrap,它可以检测到它。
进入css并查看评论,我会找到类似的内容:
/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) { ... }
默认情况下它是全宽的,但容器有一些边距,但没什么可担心的,你总是可以覆盖这些类或使用
制作自定义样式表如果您想手动完成,平板电脑的全宽度就像设置container
div width:100%
我的建议:自定义boostrap上.container
的边距(也可能是cols)以获得全宽度模板。