Question

我使用此代码自动检测用户屏幕分辨率并重定向到另一页

<script>
if (screen.width==1367 && screen.height==768)
{
window.location="http://www.yoursite.com"
}
</script>

但是对于每个屏幕分辨率我都不能编辑网站。我可以制作可以自动适应屏幕的单页。先谢谢你。

Answer 1

您可以使用CSS3媒体查询而不是javascript来检测设备并相应地加载页面。

@media only screen and (max-width: 999px) {
  /* rules that only apply for canvases narrower than 1000px */
}

@media only screen and (device-width: 768px) and (orientation: landscape) {
  /* rules for iPad in landscape orientation */
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  /* iPhone, Android rules here */
}

您还需要添加元端口视图标记，如下所示：

<meta name="viewport" content="initial-scale=1.0">

Answer 2

您可以使用媒体查询并为不同的屏幕指定不同的样式表。

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

例如

<style>
@media (max-width: 600px) {
  .facet_sidebar {
    display: none;
  }
}
</style>

有关已经提出的网站的示例，请参阅：http://mediaqueri.es/

Answer 3

'defau1t'是写的。你也可以通过css like =＆gt;设置它。 “宽度：100％”;你也可以查看http://www.w3schools.com/js/js_window.asp。一切都取决于您的要求。

Answer 4

尝试使用JqueryUI Layou t并检查this question

适合每个屏幕分辨率的网页

4 个答案: