HTML页面是如何适应不同分辨率的显示器
HTML页面何适应不同分辨率的显示器可以通过:响应式布局、自适应网页设计等方法:
1、响应式布局设计:
响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验,响应式布局就是实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。一个网站能够兼容多个终端,而不是为了每一个终端做一个特定的版本。
2、自适应网页设计:
自适应网页设计(Adaptive Web Design)指能使网页自适应显示在不同大小终端设备上新网页设计方式及技术。
扩展资料:
响应式布局与自适应布局的区别:
1、自适应布局通过检测视口分辨率,来判断当前访问的设备是:pc端、平板、手机,从而请求服务层,返回不同的页面;响应式布局通过检测视口分辨率,针对不同客户端在客户端做代码处理,来展现不同的布局和内容。
2、自适应布局需要开发多套界面,而响应式布局只需要开发一套界面就可以了。
3、自适应对页面做的屏幕适配是在一定范围:比如pc端一般要大于1024像素,手机端要小于768像素。而响应式布局是一套页面全部适应。
4、自适应布局如果屏幕太小会发生内容过于拥挤。而响应式布局正是为了解决这个问题而衍生出的概念,它可以自动识别屏幕宽度并做出相应调整的网页设计。
参考资料来源:百度百科-响应式布局
参考资料来源:百度百科-自适应网页设计
虽然每个人的显示器有大有小, 但是,你感觉看起来会很大或者很小,只是一个视觉差而已!
各人看自己的显示器,习惯了就好!
当你看一个很大的东西,看习惯了之后, 然后再去看一个小的东西,你会觉得很小很小, 但多看几天, 你会觉得,其实也差不多, 这就是视觉差!
没必要刻意的去如何的来修正, 总之,习惯了就好!
你只要把你的html的总体宽度, 弄一个比较常规的尺寸即可!
一般是960或者950, 当然, 你也可以设置为满屏!
这是基于pc网站下, 如何你是做手机网站, 那一般都是满屏, 手机浏览的时候, 会自动适应手机屏幕的大小!
你可以先把页面设置为1200px。居中。960的宽度已经过时了。现在主要是面向客户的思想去编写网站架构。主流显示器都在1200+,所以,我建议你宽度设置为1200px.事实也是如此。我们公司现在的宽度基本都定义1200px.做响应式的除外。
你说的图片是正常的。你站在地上,看掉在地上的一个硬币。会感觉还OK。是个硬币大小。但是你站在5楼在去看硬币,或许你就找不到硬币的位置了。同理。楼主不要纠结这些事了。
自适应布局,使用百分比宽度来自适应屏幕大小。
响应式布局,使用CSS的@media规则,根据不用屏幕大小范围,编写多个CSS样式,来适应多种屏幕大小。
你可以先把页面设置为1200px。居中。960的宽度已经过时了。现在主要是面向客户的思想去编写网站架构。主流显示器都在1200+,所以,我建议你宽度设置为1200px.事实也是如此。我们公司现在的宽度基本都定义1200px.做响应式的除外。
你说的图片是正常的。你站在地上,看掉在地上的一个硬币。会感觉还OK。是个硬币大小。但是你站在5楼在去看硬币,或许你就找不到硬币的位置了。同理。楼主不要纠结这些事了。