為什麼手機網頁都是980px
㈠ 一般網頁的尺寸是多大
寬度通常980px， 990px，1000px的都有，還有的是適用以前老屏的960的（現在用的少了），高度不限，主要根據你網站針對的對象。
㈡ 設置什麼視口是響應式設計、移動端開發的基礎
設置布局視口是響應式設計、移動端開發的基礎。
1、移動設備的瀏覽器都默認設置一個布局視口，用於解決早期的pc端在手機上顯示的問題。
2、ios、Android基本都將這個視口解析度設置為980px，所以pc上的網頁大多都可以在手機上呈現。
㈢ 頁面的版心為980px什麼意思
指頁面最大寬度不超過980px，當用戶顯示屏的寬度超過980px時候 頁面水平居中，超過980px的顯示區域顯示為白底，頁面始終顯示在屏幕的中間。如果顯示屏寬度低於980px時，就會出現縱向滾動條。設置版心有利於兼容不同尺寸的顯示屏，從而無論使用何種寬度的顯示屏都能得到同樣的頁面顯示效果。
㈣ 網頁的兩種尺寸1180px,980px是指什麼
這應該是解析度吧，一般調成1280*960就可以了
㈤ 寬度設置成980px 所有手機就都可以正好橫向滿屏不需要滾動條
<body rightmargin="0" leftmargin="0" topmargin="0" bottommargin="0"> ↑ ↑ ↑ ↑ 說明： 右邊距 左邊距 頂部邊距 底部邊距 因為拖動條寬度是20，左右兩邊都要各自留出2的邊框 在800*600下要做個滿IE的表格，圖象的話就用800-2*2-20=776 單位是像素 1024*768就是1000 上面說的是保守的估計，其實在不同的操作系統下和不同的WINDOWS皮膚下也會不一樣的，在不同的瀏 覽器下也是，在2000下就比在XP下能顯示得多一些。 列如騰訊的TT 2.3 1024*768下 能顯示滿屏尺寸 1007*572 而IE 6.0 1024*786下 滿屏尺寸 1003*597 所以在設置寬度的時候800*600最好選764 1024*768可以選到100-1003之間，最大不能超過1006 這里僅僅提供參考。當然，用百分比的話就不會用到上訴的問題，而有很多網頁都是不適合拉伸的。 如果怕超出了會出現不想出現的拖動條，可以參考這里，加入裡面的代碼，這樣滿屏顯示就完美的 解決了。
㈥ 瀏覽器顯示的網頁不能占滿窗口。居中顯示。
這個沒有辦法，如果你要調的話只能讓畫面變形也就是變扁。不推薦，還是這樣顯示比較好。因為你的屏幕解析度就是這樣的，如果你非要調的話，可以在桌面右鍵屬性，調節解析度，如果不好用的話，就設置注冊表吧。
㈦ 求助網頁的顯示解析度是怎麼回事
打開網頁後，網頁被拉得寬寬的，像是被拉長了一樣，用PPS看電影也是這個樣子，本來桌面也是這樣的圖標變大，壁紙被拉大，後來我調整了解析度，桌面回復正常了，但是打開網頁和PPS還是那個樣子，被拉得長長寬寬的、
㈧ 頁面布局方案
例如：對於DPR=2的Retina屏幕而言1個點陣圖像素對應於4個物理像素，由於單一點陣圖像素不可再分割，所以只能就近取色，從而導致圖片模糊。所以對於圖片清晰度問題，較好的方案是提供兩倍圖 @x2 。
像素密度表示設備屏幕能夠顯示的設備獨立像素DIP的數量，屏幕顯示的像素數量越多畫面也就越精細，同時同樣屏幕區域能夠顯示的信息也就越多。
屏幕由像素點組成，每個像素點發出不同顏色的光，進而構成界面。而屏幕的物理尺寸與像素尺寸是不成比例的。不同尺寸的手機屏幕擁有不同的解析度，解析度實際上是手機像素的寬高尺寸。
像素密度（pixels per inch,PPI或DPI）表示每英寸長度上排列的設備獨立像素點DIP的個數，1英寸等於2.53厘米。像素密度PPI越高則表示屏幕解析度越高進而屏幕顯示越精細。Retine屏幕比普通屏幕清晰的原因，是因為它的像素密度是普通屏幕的數倍。
例如：3.5英寸的iPhone手機屏幕
日常所說的屏幕尺寸，實際是指屏幕對角線的長度。計算像素密度首先需要計算設備屏幕對角線等效像素，然後除以對角線長度。例如HTC G7解析度為480x800，3.7英寸，計算出像素密度為252PPI。
像素密度PPI = 平方像素寬加平方像素高之和開平方的結果，再除以屏幕對角線的英寸數。
密度決定比例
通過計算像素密度PPI可以得知設備屏幕屬於哪個密度區間，因為不同密度區間對應著不同的默認縮放比例。
通俗來說視區 Viewport 就是瀏覽器上用來顯示頁面的區域，也就是說，瀏覽器的實際寬度和手機寬度不一樣，無論手機寬度是320px或640px，在手機瀏覽器內部寬度始終會是瀏覽器本身的視區。
現代瀏覽器都會給自身的視區提供一個默認值，大多會以980px或1024px為主。在移動端視區默認一般來說是會大於手機屏幕的，所以當在桌面瀏覽器正常顯示的頁面，會以960px設計主區域。放到移動端就會出現橫向滾動條，因此會專門會給瀏覽器設計移動端的頁面。
移動端瀏覽器會將頁面放在一個虛擬的窗口 viewport 中，通常這個虛擬的窗口會比屏幕寬，這樣就不用將每個頁面擠到很小的窗口中，以防止破壞沒有針對手機瀏覽器優化的網頁布局，用戶可以通過平移或縮放來查看頁面中的不同部分。
頁面中視區 viewport 是可繪制的區域，雖然視區的可視面積和屏幕尺寸相匹配，但視區頁由自己的尺寸，用來確定頁面中的像素數量。
在 iPhone 和 Android 平台中 WebKit 內核的歷覽器使用980像素寬的視見區或邏輯尺寸，相當於viewport中的width=980px。當頁面載入後，頁面內容通常被完全縮放以便整個頁面都可見，盡管內容會被縮放的非常小且不可讀。
在Web頁面中，可通過JS動態獲取相關參數。
根據目前市場主流移動終端，統計設備獨立像素後，移動端H5設計稿推薦尺寸為640 x 1136、750 x 1334。
除去瀏覽器全屏顯示，幾乎所有情況下均會存在頂部狀態欄和導航欄。根據iPhone標准，狀態欄和導航欄的獨立像素高度分別為40px和88px。Android平台可以更改狀態和導航欄高度可取默認值48px和100px為准。在網頁中就會將頁面內容向下擠入盲區，根據不同的布局方式可能會擠出視口，也就是可視區域之下。因此取兩個平台的最大值148。因此設計稿要盡量保證單頁下沒有重要內容。如果要在所有屏幕上將重要內容顯示完全，需要注意市面上存在的小尺寸屏幕，絕對部分智能機解析度在640 x 960之上，因此只要重要內容放在盲區之上即可。計算出的最安全高度為812 = 960 - 148。
簡單來說視區 Viewport 是嚴格等於瀏覽器的窗口，在桌面瀏覽器中視區就是瀏覽器窗口的寬高，但在移動設備上由於視區太窄，為了更好的為 CSS 布局服務，所以提供了兩個視區，分別是可見視區 Visual Viewport 和布局視區 Layout Viewport 。
如果將移動設備瀏覽器的可視區域設置為Viewport，某些網站會因為Viewport太窄而顯示錯亂，所以瀏覽器會默認將Viewport設置為一個較寬的值，比如980px，使得為桌面瀏覽器設計的網站也能在移動設備瀏覽器上正常顯示。這個瀏覽器默認的Viewport也就是Layout Viewport布局視區。布局視區的寬度可以使用JavaScript的 document.documentElement.clientWidth 獲取。移動設備中默認的視區就是Layout Viewport。
布局視區的寬度是大於瀏覽器可視區域的寬度的，因此需要一個Viewport來表示瀏覽器可視區域大小，這個Viewport也就是可見視區Visual Viewport，可見視區可使用JavaScript的 document.documentElement.innerWidth 獲取。
Ideal Viewport是一個能完美適配移動設備的Viewport，首先無需縮放和橫向滾動條就能正常查看頁面所有內容，其次顯示的文字、圖片大小合適。比如14px的文本不會因為一個高密度像素的屏幕而顯示的太小或無法看清。無論在何種密度屏幕、何種解析度下，顯示出來的大小都差不多，這個Viewport也就是Ideal Viewport。
Ideal Viewport並沒有一個固定的尺寸，不同的設備擁有不同的尺寸。比如在IPhone設備中Ideal Viewport寬度是320px，無論屏幕寬度是320還是640的。Ideal Viewport的意義在於，無論在何種解析度下，針對Ideal Viewport而設計的頁面無需縮放和橫向滾動條都可以完美地呈現給用戶。
移動設備中默認的視區是Layout Viewport，在進行移動設備頁面開發時則需要Ideal Viewport。要得到完美視區，需設置 meta 標簽。
該 meta 標簽的作用是讓當前視區寬度等於設備寬度，同時不允許用戶手動縮放。 minimum-scale=1.0 與 maximum-scale=1.0 並不是必需的。但 width = device-width 則是必須的，以保證不會出現橫向滾動條。
width 能夠控制默認布局視區Layout Viewport的寬度，若不指定則默認會是980px或1024px，這個值會由設備自身所決定。當把布局視區寬度設置為移動設備寬度 width = device-width 時，此時布局視區將會變成完美視區。
其實要將當前視區寬度設置為完美視區寬度，既可以設置 width = device-width 也可以設置 initial-scale = 1.0 ，但是單單設置 width = device-width 會導致iPhone、iPad設備中橫豎屏不分，單單設置 initial-scale = 1.0 則會導致IE中橫豎屏不分。所以都以豎屏的完美視口寬度為標准，最完美的寫法時兩則都寫上去， width = device-width 解決iPhone、iPad缺陷， initial-scale = 1.0 則解決IE的缺陷。
CSS3新增視區單位vm和vh，在移動端iOS8+和Android4.4+獲得支持。
設備像素比定義了物理像素與設備獨立像素之間的對應關系，計算公式為：設備像素比 = 物理像素 / 設備獨立像素。
在CSS中可通過以下方式進行媒體查詢，針對不同DPR設備做出樣式適配。
在JavaScript中可通過 window.devicePixelRatio 獲取當前設備的DPR。
在Ratina高清設備屏幕中一個CSS像素對應4個物理像素
Web頁面設置視口後，頁面與屏幕是1:1顯示，移動設備都具有設備像素比 DPR ，當DPR=2時移動設備上的一個CSS像素由4個物理像素點組成。
安卓客戶端限制了 viewport 設置的縮放屬性，讓客戶端放開限制就行，但是由於市場上的app版本還是不支持，所以需要做兼容性處理。
iPhone6 上有1px 的滾動條，最後處理方案是通過 viewport 中的 maximum-scale 的值加了0.1，由於設置了user-scalable=no，maximum-scale 的值加0.1並不會有什麼影響。
通過JS動態獲取移動設備的設備像素比，通過設備像素比來計算並設備Web頁面中 html 標簽的字體大小 font-size 以及縮放比例。
例如：動態設置 html 的font-size, 同時根據設備DPR調整頁面的縮放值，進而達到高清效果。
rem 全稱 font size of the root element 是指相對於根元素的字體大小的相對單位，計算規則依賴於根元素。
rem 是通過根元素進行適配的，web中根元素是指 html ，所以通過設置 html 的字體大小即可控制 rem 的大小。
REM布局的核心是設置好根 html 元素的字體大小 font-size ，為了防止在高清屏下像素不夠用而導致模糊，當拿到移動設計稿時，移動設計稿一般會以iPhone5設備寬320px或iPhone6設備寬375px為基準，製作出兩倍寬的設計稿，即640px或750px。
例如：設置 html 標簽的 font-size:10px ，6rem即6*10px。
rem 適用於WebApp，出於兼容性考慮，WebApp下使用 rem 更加能凸價值和功能。
使用CSS的媒體查詢控制
移動UI設計稿會採用iPhone寬度作為標准
使用JS控制Web頁面文字大小使其自適應屏幕
使用 rem 布局的本質是等比縮放，一般是基於寬度。
將屏幕寬度均分100份，每一份的寬度使用x表示，即x=屏幕寬度/100，如果將x作為單位，x前面的數值代表屏幕寬度的百分比。想要屏幕元素隨著屏幕寬度等比縮放，只需要確定x單位，可通過CSS3中的 rem 來實現。可通過JS設置HTML字體大小等於屏幕寬度的百分之一。
若UE設計稿寬度尺寸為640px，設計稿中某元素寬度為100px，則可以計算出100 / 640px * 100px = 15.625。
最佳實踐：px2rem移動端自適應方案 https://github.com/imochen/hotcss
字體大小不能使用 rem ，因為字體大小和字體寬度並不是線性關系，所以字體大小不能使用 rem 。由於設置根元素字體大小會影響所有沒有設置字體大小的元素，因為字體大小是會繼承的，可以在 body 上做字體修正。
如何實現字體的響應式，可通過修改 body 字體大小，同時設置字體大小使用 em 單位。
㈨ the new iPad 的解析度達到了2048，但為什麼用它看網頁（大多是980px解析度）左右兩側卻沒有大的留白呢
這跟系統和瀏覽器是有關系的，瀏覽器本身會調整網頁的顯示方式，已達到最好的瀏覽體驗，如果兩邊留白那實際看到的文字內容就會很小，瀏覽網頁的感覺就會大打折扣