通過 media解決不同解析度，布局混亂問題

利用@media screen實現網頁布局的自適應

優點:無需外掛程式和手機主題,對移動裝置友好,能夠適應各種視窗大小。只需在css中新增@media screen屬性,根據瀏覽器寬度判斷並輸出不同的長寬值

1280解析度以上（大於1200px）

@media screen and (min-width:1200px)#content,.div1#secondary

}

@media screen and (min-width: 960px) and (max-width: 1199px) #content,.div1#secondaryselect

}

@media screen and (min-width: 768px) and (max-width: 959px) #content,.div1#secondaryselect

}

@media only screen and (min-width: 480px) and (max-width: 767px)#content,.div1#secondary#access#access a #access a img#rss#branding #s

}

@media only screen and (max-width: 479px) #content,.div1#secondary#access #access a #access a img#rss#branding #s#access ul ul a

}

螢幕解析度問題及 media

1.畫素 物理畫素 裝置畫素 物理畫素也被稱為裝置畫素，它是顯示裝置最微小的物理部件。螢幕密度 通常以每英吋有多少物理畫素來計算 ppi 獨立畫素 css畫素，是乙個抽象的單位，主要用於瀏覽器上，用了精確度量web頁面上的內容。一般情況下，css畫素被稱為與裝置無關的畫素 device indepe...

Android不同解析度適配

適配可以分為 layout land 橫屏布局 layout port 豎屏布局 layout 1920x1080 或者layout land 1920x1080 layout port 1920x1080 注 如果適配的布局檔案中，沒有當前機型，當前機型會選擇相差最小的解析度的配置檔案進行適配 l...

網頁不同解析度適配

你大聲的嚷著你的手機解析度就是1920 1080的，這是你攢了足足兩個月的錢後在小公尺官網買的紅公尺手機，絕不可能有假。你寫了乙個寬為 960px 的 div，用手機的瀏覽器橫屏開啟後，你期望這個該死的 div 會和在電腦上的瀏覽器載入出來一樣的效果，只佔螢幕的一半。結果卻讓你納了血悶，明明電腦上解...