如果瀏覽器大小很小，請完全更改網站

-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

回答