pc端自適應方案

一、常見處理方式

1. 定寬
   電商類、內容為主的網站幾乎采用這種方式
   1.網易考拉、京東（1190px）
   2.知乎（1000px),果殼（1000px),網易新聞（1200px)
2. 媒體查詢+定寬
   圖片類、簡單布局。在達到某個斷點之后更改內容區的寬度，並把某個內容顯示/隱藏
   1.花瓣網

1. @media screen and (min-width: 1529px)版心為1500px
2. @media screen and (min-width: 1276px) and (max-width: 1528px)版心為1248px
3. @media screen and (max-width:1275px)版心為996px

2.天貓  

1. @media screen and (min-width:1260px)版心為1230px
2. @media screen and (max-width: 1260px)版心為982px

二、常見pc屏幕

一般只需要適應 1920px、1440px、1366px主流分辨率

三、注意事項

1.如果是自適應盡量控制變化范圍、盡量只是布局微調
2.不對過多地方做響應式減少設計和前端的工作
3.在設計前期，由前端和設計共同確定斷點，一般設計兩個端點就差不多了。