只製作基於手機的網站

Question

我並不太困惑，只爲移動和平板電腦製作網站，而不是桌面。我只需要知道一件事。

1. 我是否應該使用<meta name="viewport" content="width=device-width, initial-scale=1">併爲特定設備定義@media only screen？

Answer 1

是的，但你的網站仍然會從其他devices.I入店可以解釋爲你：

使用標籤：

<meta name="viewport" content="width=device-width, initial-scale=1"> 

它會調整網頁寬度以匹配設備寬度和將初始縮放設置爲1（不縮放）。例如，如果您使用iPad打開此頁面，則Web瀏覽器將以1024x768（橫向）或768x1024（縱向）顯示頁面。

initial-scale=1 

這將迫使顯示在變焦設網頁爲1

使用媒體查詢CSS3可以爲不同的設備設置不同的CSS樣式：

的樣式片

@media screen and (min-width: 768px) and (max-width: 1024px) { 

    /* Styles for tablets */ 
} 

桌面樣式

@media screen and (min-width: 1025px) and (max-width: 1280px) { 

    /* Styles for Desktops */ 
}