前端不能放棄1200px的理由

PrototypeZ 發布于2019-08-30 13:59 / 695人閱讀

摘要：開發過程中，可能會遇到這種情況電腦屏幕是寸，寸的，但是在瀏覽器中顯示寬度沒有達到自己屏幕的寬度，導致樣式把控上很不方便。以確保大多數筆記本的顯示情況是符合我們期望的那樣。前端技術交流群歡迎加入

開發過程中，可能會遇到這種情況：電腦屏幕是13寸，14寸的，但是在瀏覽器中顯示寬度沒有達到自己屏幕的寬度，導致樣式把控上很不方便。

這種問題多發現于筆記本電腦上，并不是說臺式機上沒有這個問題，而是臺式外接的屏幕就當今而言不會特別小，所以不容易發現而已。

原因：高分辨率導致

在這么多年的電腦使用中，不知道你有沒有發現，電腦屏幕的分辨率越低，字體與圖標越大；而分辨率越高，字體和圖標越小：

低分辨率

高分辨率

現實情況下，主流的電腦品牌拿出2K屏，乃至4K屏作為銷售賣點，所以會出現小屏幕配高分辨率的情況。那這樣是不是筆記本用了高分辨率，本來屏幕就不大的情況下，字太小會導致看不清楚呢？
答案是否定的，你仔細看你的筆記本，其實并不會有字太小看不清楚的情況。因為現在的系統會根據配置默認把字體放大，以至你看起來并不會覺得有什么問題，以window10為例：

上圖那個推薦選項就是系統默認的選項，也正是這個原因導致瀏覽器渲染寬度變小。(你可以嘗試改變選項來看看效果)

總結

現在的操作系統會根據電腦的屏幕大小和分辨率大小來調整文本及應用的大小，以便適配小屏幕上使用高分辨率顯示不清的問題。這也是導致瀏覽器渲染的時候，渲染的窗體寬度小于實際電腦屏幕的寬度。

所以我們在確定兼容最小寬度的時候，考慮到系統會往下縮放，最好堅持版心1200px的底線。以確保大多數筆記本的顯示情況是符合我們期望的那樣。

前端技術交流群：709397872（歡迎加入）

GPU云服務器云服務器 1200機柜 java實戰1200 px 服務器機柜深1200

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/115690.html

前端不能放棄1200px的理由

摘要：開發過程中，可能會遇到這種情況電腦屏幕是寸，寸的，但是在瀏覽器中顯示寬度沒有達到自己屏幕的寬度，導致樣式把控上很不方便。以確保大多數筆記本的顯示情況是符合我們期望的那樣。前端技術交流群歡迎加入開發過程中，可能會遇到這種情況：電腦屏幕是13寸，14寸的，但是在瀏覽器中顯示寬度沒有達到自己屏幕的寬度，導致樣式把控上很不方便。這種問題多發現于筆記本電腦上，并不是說臺式機上沒有這個問題，而...

wanghui 2019-08-26 17:15 評論0 收藏0
從項目中學習HTML+CSS

摘要：最近由于工作原因以及自己的懈怠，已經很久都沒有更新過博客了。所以這次就根據具體的一個網頁項目來梳理一下我這段時間學習這些東西的成果。最近由于工作原因以及自己的懈怠，已經很久都沒有更新過博客了。通過這段時間，我發現堅持一件事情是真的很難，都說萬事開頭難，但是在放棄這件事上好像開頭了后面就順理成章的繼續下去了。中間即使不怎么情愿也在努力的每周更新博客，但是自從9月份以來，第一次因為工作需要加班而...

Lin_R 2019-04-23 13:12 評論0 收藏0
小談網站建設的兼容性

摘要：本文的兼容性包含了更多的意思，一些和網站開發注意的實際問題。已經快出生十年了，它就是為了解決瀏覽器的兼容性而生的，對于桌面端開發我們還是建議采用這個版本。本文的兼容性包含了更多的意思，一些和網站開發注意的實際問題。對注重seo的網站幫助更多一些。關于瀏覽器現在的前端開發已經開始放棄兼容ie6,ie7,并且也在有條件的放棄ie8。像chrome這樣的現代瀏覽器對新特性支持度都很棒，...

soasme 2019-05-29 17:52 評論0 收藏0
CSS布局

摘要：圣杯布局圣杯布局和雙飛翼布局都是為了解決兩邊定寬，中間自適應的三欄布局，中間欄在最前面優先渲染，多見于商城類網站布局。雙飛翼布局不用設置相對布局，以及對應的和值。合理的布局是產品的基礎，可以使人感覺整齊大方，提升用戶體驗。掌握幾種常見的布局形式也是前端開發的基礎，對于快速實現頁面重構有很大幫助。原文鏈接單列布局單列布局通常用于網站的首頁，分為頭部的導航、網頁內容、頁腳相關信息。...

kviccn 2019-08-30 13:46 評論0 收藏0