1、html{font-size:62.5%;}//不用font-size:10px的原因:(因为设了62.5%后就有1rem = 10px,便于用rem来指定元素的尺寸,这样响应式的时候可以直接改变font-size而无需计算其他各种样式中出现的尺寸了。 用rem定义尺寸的另一个好处是更能适应缩放/浏览器设置字体尺寸等情况(因为rem相对于字体大小,会同步改变)。

至于选择62.5%而非10px的原因,主要是兼容性和未来发展趋势的综合考虑,px这个单位的含义已经越来越混乱,几乎无法评估以后的设备是会一直像现在这样对网页上的px做兼容处理,还是让px回归“像素”的本意,但62.5%代表默认字体尺寸的62.5%这个含义基本不会有混乱---引自https://segmentfault.com/q/1010000002411895

)

2、宽度用百分比

3、高度可以用rem

4、最好不用float  用display:-webkit-box;

.box{
/* display */
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -o-box;
display: box;

/* box-orient */
/**
* vertical column
* horizontal row
*/
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-flex-direction: column;
-o-box-orient: vertical;
box-orient: vertical;

/* box-flex */
-webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
-o-box-flex: 1;
box-flex: 1;

/* box-pack */
-webkit-box-pack: justify;
-moz-box-pack: justify;
-ms-flex-pack: justify;
-o-box-pack: justify;
box-pack: justify;

/* box-align */
-webkit-box-align: justify;
-moz-box-align: justify;
-ms-flex-align: justify;
-o-box-align: justify;
box-align: justify;
}

5、同PC端一样,H5中的js最好也写在window.onload(function(){})或$(function(){})中

H5学习的更多相关文章

  1. H5学习的第三周

    上周,我们结束了京东站的制作,本周我们开始了手机站和响应式网站的学习,并仿制了一个手机端界面和一个响应式界面,在完成这两个网站的过程中我遇到了许多问题,也了解了它们的解决方法,接下来我讲详细介绍本周我 ...

  2. H5学习第二周

    怎么说,在各种感觉中h5学习的第二周已经过来了,先总结一下,感觉学习h5是一件让我爱恨交加的事,学会一些新的知识并把它成功运行出来的时候是非常激动和兴奋的,但是有时候搞不懂一个标签或者属性的时候,就有 ...

  3. H5学习笔记1

    H5学习笔记 1.创建超链接: target=”_blank”:链接的目标网页会在新的窗口中打开. target=”_parent”:链接的目标会在当前窗口中打开,如果在框架网页中,则会在上一层框架打 ...

  4. 2017.3.12 H5学习的第一周

    本周我开始了H5的学习,在这一周里我们从html的基本标签开始一直讲到了才算css的用法,接下来我将记录下来本周我学到的H5的内容. 首先是声明文档,声明文档类型是HTML5文件,它在HTML文档必不 ...

  5. H5学习第一周

    已经接触H5一个周了,经过学习,总算对H5有了一些了解和认知,下面就总结一下我对H5的认知和感悟. 首先接触的是H5的常用标签[meta],它有其以下常用属性 1.charset属性.单独使用,设置文 ...

  6. H5学习之--前端和PHP后端的简单交互

    最近在学习前端的东西,H5+CSS3+JS,又分别学习了原生JS和jQuery库,还有Bootstrap框架,因为我是做ios开发的,所以先熟悉WebApp相关的开发知识,其他的学习资料,网上有很多的 ...

  7. H5学习系列之Geolocation API

    获取位置信息途径: 1.IP地址地理定位数据 2.GPS地理定位数据 3.WI-FI地理定位数据 4.手机地理定位数据 无废话直接上重点:navigator.geolocation对象就是获取地理位置 ...

  8. H5学习系列之Audio和Video

    1.视频文件:音频轨道.视频轨道和一些元数据(视频封面.标题.子标题.字幕等相关信息). 2.目前H5还不支持的:流式音频和视频(H5对视频的支持只限于加载的全部媒体文件).H5的媒体收到跨域资源共享 ...

  9. H5学习小结——div+css创建电子商务静态网页

    使用Sublime Text软件编写电子商务类网站静态形式首页 经过差不多一星期的学习,基本掌握了div+css的用法之后,开始了实战练习.首先要做的就是要练习一下一般电子商务网页的编写,我做的是下图 ...

随机推荐

  1. 使用Event Message 对 Package 进行Troubleshoot

    在SSIS Server上,发现一个Package Job运行异常,该Package处于僵死状态.从 Job Activity Monitor中看到该Job一直处于运行状态,但是,DW中没有执行任何Q ...

  2. LINQ系列:Linq to Object分组操作符

    分组是指根据一个特定的值将序列中的值或元素进行分组.LINQ只包含一个分组操作符:GroupBy. GroupBy 1>. 原型定义 public static IQueryable<IG ...

  3. iOS之Core Data及其线程安全

    一.简介 Core Data是iOS5之后才出现的一个框架,它提供了对象-关系映射(ORM)的功能,即能够将OC对象转化成数据,保存在SQLite数据库文件中,也能够将保存在数据库中的数据还原成OC对 ...

  4. ASP.NET MVC5 网站开发实践(二) Member区域 - 咨询管理的架构

    咨询.留言.投诉等功能是网站应具备的基本功能,可以加强管理员与用户的交流,在上次完成文章部分后,这次开始做Member区域的咨询功能(留言.投诉都是咨询).咨询跟文章非常相似,而且内容更少.更简单. ...

  5. BFC之宽度自适应布局篇

    说到自适应布局,我们曾在“抛砖引玉之宽度自适应布局”一文中学习过.当时的核心思想主要是利用float+margin的形式.利用块状元素的流体特性,然后计算出float元素的宽度,并赋予到块状元素的相应 ...

  6. Util应用程序框架公共操作类(七):Lambda表达式公共操作类

    前一篇扩展了两个常用验证方法,本文将封装两个Lambda表达式操作,用来为下一篇的查询扩展服务. Lambda表达式是一种简洁的匿名函数语法,可以用它将方法作为委托参数传递.在Linq中,大量使用La ...

  7. C#互斥体——Mutex

    Mutex对象是一个同步基元,可以用来做线程间的同步. 若多个线程需要共享一个资源,可以在这些线程中使用Mutex同步基元.当某一个线程占用Mutex对象时,其他也需要占用Mutex的线程将处于挂起状 ...

  8. 辗转相除法求最大公约数,非goto

    #include<iostream> using namespace std; //不推荐用goto,当然用它更快 //辗转相除法求两数的最大公约数 int gcd(long int a, ...

  9. 1Z0-053 争议题目解析470

    1Z0-053 争议题目解析470 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 470.Which NLS parameter can be used to change the ...

  10. 源码阅读系列:EventBus

    title: 源码阅读系列:EventBus date: 2016-12-22 16:16:47 tags: 源码阅读 --- EventBus 是人们在日常开发中经常会用到的开源库,即使是不直接用的 ...