cruiedu@com 大家好，今天小编来为大家解答网页设计尺寸这个问题，网页尺寸规范很多人还不知道，现在让我们一起来看看吧！
来源：学ui设计网作者：学UI设计
简单的说明一下：我们经常看见的网页都是居中类型的，做起来容易，只要设置好主内容的宽度然后居中就好。适合门户网站、平台类网站、内容比较多信息量大的站点。
另外一种是布满全屏的网页，又分为自适应和响应式。常见的全屏的后台界面就是自适应的，国外常见这种形式，一般在一些流行的设计产品上多见，科技公司网站和一些高逼格的站点。
设计的时候图标可以做成字体图标或者svg矢量格式的，具体要和前端配合完成，一般遵循文字流式，控件弹性，图片等比缩放这3大适配技巧。
大家都知道在网页中栅格化是很常见，也是很保险的一种做法，良好的运用栅格化是网页设计中的一大利器，但是对于像小编这种对数字不是很敏感的设计师，算间距，算内容大小，简直要命，每次都要算好多次，这款小工具就完美的解决了算数这一大问题。从此对栅格化间距说soeasy！
传送门地址：http://grid.guide/
页面简洁清晰，可以看到的直观操作就五个，只要确定好内容总体宽带，分栏数喝颜色，下面就给你分了很多不同的间距的栅格，当然每个栅格都可以下载，拖进ps，拉好参考线即可！
操作系统尺寸inPPI纵横比宽x高dp宽x高px密度dpiMacBookOSX12.022616:101280x8002304x14402.0xhdpiMacBookAir11OSX11.613516:91366x7681366x7681.0mdpiMacBookAir13OSX13.312816:101440x9001440x9001.0mdpiMacBookPro13OSX13.322716:101280x8002560x16002.0xhdpiMacBookPro15OSX15.422016:101440x9002880x18002.0xhdpiiMac21.5OSX21.510216:91920x10801920x10801.0mdpiiMac21.54KOSX21.521816:91920x10804096x23042.0xhdpiiMac27OSX2710916:92560x14402560x14401.0mdpiiMac275KOSX2721816:92560x14405120x28802.0xhdpiSurfaceBookWindows13.52673:21500x10003000x20002.0xhdpiSurfaceProWindows12.32673:21368x9122736x18242.0xhdpiSurfaceLaptopWindows13.52013:21128x7522256x15042.0xhdpiSurfaceStudioWindows281923:22250x15004500x30002.0xhdpiDellXPS13Windows13.327616:91920x10803200x18001.5hdpiDellXPS15Windows15.628016:91920x10803840x21602.0xhdpi小米笔记本Air12.5Windows12.517616:91920x10801920x10801.0mdpi小米笔记本Air13.3Windows13.316616:91920x10801920x10801.0mdpi小米笔记本Pro15.6Windows15.616616:91920x10801920x10801.0mdpi
本教程不做商业用途，仅做学习交流使用，如果有涉及到版权问题，请及时联系删除！！！（小编分享只为自己和大家学习所用！越努力，越幸运！）
关于网页设计尺寸到此分享完毕，希望能帮助到您。
