自适应布局:不同终端上显示的文字,图片,等位置排版都是一样的,只是大小不同。 响应式布局:通过媒体查询监听屏幕大小的变化,做出响应式的改变,在不同设备可能展现不同的样式效果。 em:是相对其父元素的。 rem:相对于页面根元素,推荐使用rem。 ...
分类:
其他好文 时间:
2018-04-28 19:29:01
阅读次数:
136
前两天网友在群里说起了Flutter,就了解了一下,在手机上跑了它的demo,正接就被打动了。 虽然网上有很多教程,但真正开始的时候,还是会碰到很多坑。下面详细的讲解Flutter + Android Studio开发环境搭建。 1. 下载 Android Studio 网址: http://www ...
安装python2安装nodejs安装android-studio安装jdk8设置ANDROID_HOME环境变量把AndroidSDK中的tools和platform-tools目录添加到环境变量中设置JAVA_HOME环境变量打开andorid-studio,打开模拟器运行项目,调试
导读: 弹性盒子是 CSS3 的一种布局模式,一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有适当的行为的布局方式。其中 flex 属性用于指定弹性子元素如何分配空间。 flex 属性的值 flex-grow flex-shrink flex-basis (flex-grow为扩展比率,f ...
分类:
其他好文 时间:
2018-04-05 01:12:43
阅读次数:
212
导读: 弹性盒子是 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