如果浏览器大小很小，请完全更改网站

-1

我目前在我的CSS中使用媒体查询，但我的网站仍然看起来很糟糕。有没有办法首先确定浏览器的智慧，然后加载不同的索引文件？如果浏览器大小很小，请完全更改网站

在这里发布一些代码是我的媒体查询：

@media screen and (max-width: 600px) { 
    .topbar{ 
    opacity: 0; 
    } 
.... 
}

你是什么意思“看起来不好”？有没有特别的问题？ – 2012-08-07 14:44:32

我以为我很清楚。是的，有一个特定的问题：我不完全控制只有不同的CSS。我问我是否可以根据浏览器大小加载不同的索引文件，而不仅仅是不同的CSS，这不会很诚实。我想彻底改变我的网站的手机，不同divs等 – 2012-08-07 14:53:29

我还没有一个设计，我不能改变只是槽CSS使用媒体查询 - 你必须做错了什么（要么结构严重HTML或你错过了一些CSS知识）。 – easwee 2012-08-07 14:55:41

我要说做一些更多的研究建立你的CSS，但回答你的问题：

<script type="text/javascript"> 
if (screen.width <= 699) { 
document.location = "http://mobilesite.com"; 
} 
</script>

2012-08-07 14:57:12

这可能是加载不同的CSS文件针对不同屏幕尺寸的想法;从基本的CSS移动媒体选择到HTML：

<link rel="stylesheet" media="screen and (max-width: 600px)" href="600px.css">

2012-08-07 14:57:00 Bakabaka

对不起，在你评论时张贴了我的回答。必须同意@easwee使用不同的html文件不是一个好主意...... – Bakabaka 2012-08-07 14:59:14

一般要瞄准使用相同的HTML文件为您的网站，然后使用CSS来专门定制适用于桌面或手机。我知道你可能对这两个网站有着非常不同的想法，但如果你的标记（html代码）足够好，它可以用纯CSS完成。查看CSS Zen Garden了解CSS的强大功能。

如果你想完全重置你的CSS的移动网站，只是包装老CSS中媒体查询定向屏幕screen and (min-width: 601px)，你会发现你的移动网站是完全无样式

2012-08-07 14:58:29 Andy

css有无关根据浏览器宽度加载不同的索引文件。

如果你想样式化的元素不同的使用@media规则，确保它们设定在接近页面的底部，换句话说 - 后的主要风格，因为否则的话 - 它们将被简单地覆盖。

2012-08-07 15:00:37 skip405

回答