响应式网站:响应式网站之banner解决方案
发布人:桔子科技 发布时间:2019-09-11 17:33:35 分享到:
响应式其实是一种布局,是为了自动适配不同终端设备而自动响应的排版布局,在网站建设行业属于前端排版环节。
响应式网站即通常人理解的自适应网站,能够兼容PC、手机、平板电脑等众多的终端设备。在大部分终端访问时,都能够正常显示,如:在电脑上打开时显示为宽屏,手机上会自动适应屏幕的宽度,内容满屏显示,超出宽度的会自动换行。
网页元素中,部分内容是可以利用自动换行来解决不同终端显示问题。如产品列表、图片、文字说明等,都可以自动适应手机的宽度。但是网站banner(导航下方的“幻灯片”),为了适应目前显示器的主流宽度:1920像素,以及最佳观赏效果,都会做成1920像素,高度不固定。这样的尺寸在分辨率为1920×1050像素电脑上能够完美展示,而在其它较低的分辨率的电脑上,如1680x1050像素、1280×800像素等,banner只能显示中间的一块,超出的部分会自动隐藏。
针对分辨率的不统一,为了达到最佳观赏效果,习惯上设计师会把banner里内容的宽度以及网页中内容的宽度做成1200像素,这样即使是在在不同的分辨率都能够正常显示,在电脑上按跟屏幕的100%宽度显示。而在手机等小屏幕的终端设备上,便不能按照100%显示。手机的屏幕比较窄,如果让banner100%显示,无法看清楚。
下一篇:响应式网站:响应式网站有很多优点上一篇:响应式网站:响应式网站布局介绍有那三种