导读: 弹性盒子是 CSS3 的一种布局模式,一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有适当的行为的布局方式。其中 flex 属性用于指定弹性子元素如何分配空间。 flex 属性的值 flex-grow flex-shrink flex-basis (flex-grow为扩展比率,f ...
分类:
其他好文 时间:
2018-04-04 21:10:14
阅读次数:
184
本书将当前Web 设计中热门的响应式设计技术与HTML5 和CSS3 结合起来,为读者全面深入地讲解了针对各种屏幕大小设计和开发现代网站的各种技术。书中不仅讨论了媒体查询、弹性布局、响应式图片,更将新的和有用的HTML5 和CSS3 技术一并讲解,是学习新Web 设计技术不可多得的佳作。 - 理解响 ...
分类:
Web程序 时间:
2018-03-30 23:14:27
阅读次数:
398
使用rem进行换算,根据移动端屏幕大小的变化,来动态的设置根元素的字体大小,rem就是根据根元素html的字体大小渲染的,如果是375px的设计图,那么就将元素的尺寸px乘以2,在除以100就是该元素的rem值了function mobileMatvhing(){ var html = docume ...
分类:
移动开发 时间:
2018-03-29 19:10:17
阅读次数:
224
随着高端手机(Andriod,Iphone,Ipod,WinPhone等)的盛行,移动互联应用开发也越来越受到人们的重视,用html5开发移动应用是最好的选择。然而,每一款手机有不同的分辨率,不同屏幕大小,如何使我们开发出来的应用或页面大小能适合各种高端手机使用呢?学习html5 viewport的 ...
分类:
移动开发 时间:
2018-03-16 23:49:13
阅读次数:
497
静态布局:页面的宽高是固定的,超出页面的内容用户手动拖拽。手机端的话,另外设计一套。 自适应布局:用媒体查询(@media)根据不同屏幕定义不同的宽高,比静态布局少了用户手动拖拽的几率。 (因为媒体查询范围不能做到无穷的刚刚符合各个屏幕,页面内容不多不多少的和屏幕大小一样,不用到拖拽) 流式布局:页 ...
分类:
其他好文 时间:
2018-03-11 19:17:07
阅读次数:
120
为了加强界面的一致性,提高用户体验,Dynamics 365 Online V9发布了新的Interface:Unified User Interface。 区别于旧的Regular UI,UUI自适应浏览器,屏幕大小以及访问的设备,减少定制化的工作,实现界面的统一。当然,之前的界面在用浏览器访问的 ...
分类:
其他好文 时间:
2018-03-06 12:50:08
阅读次数:
163
为了适应移动终端的各种分辨率大小,各种屏幕宽高比,在 cocos2d-x(当前稳定版:2.0.4) 中,提供了相应的解决方案,以方便我们在设计游戏时,能够更好的适应不同的环境。 而在设计游戏之初,决定着我们屏幕适配的因素有哪些,简而言之只有两点:屏幕大小 和 宽高比。这两个因素是如何影响游戏的: ? ...
分类:
其他好文 时间:
2018-03-01 23:41:07
阅读次数:
365
通常我们需要让自己的网页内容能够更好的适配各种屏幕大小,会采用height:100%,但是我们发现问题出来了,height:100%无效,其实解决办法很简单 解决:你只需要在css处添加上html, body{ margin:0; height:100%; }即可。 原因:你让div的height= ...
分类:
Web程序 时间:
2018-02-11 21:21:02
阅读次数:
164
一、概念: 1.屏幕大小:指屏幕对角线长度,单位是英寸 2.像素:组成图像的最小点,一个相对大小单位,同屏幕里越小越清晰 3.屏幕像素密度(ppi)=像素总数/屏幕大小(英寸) 4.视网膜屏幕原理:当手机距离你约25-30厘米,如果手机ppi达到300以上,你的眼睛将无法分辨出像素点 5.dpi:平 ...
分类:
移动开发 时间:
2018-02-01 00:14:10
阅读次数:
237