H5学习
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学习的更多相关文章
- H5学习的第三周
上周,我们结束了京东站的制作,本周我们开始了手机站和响应式网站的学习,并仿制了一个手机端界面和一个响应式界面,在完成这两个网站的过程中我遇到了许多问题,也了解了它们的解决方法,接下来我讲详细介绍本周我 ...
- H5学习第二周
怎么说,在各种感觉中h5学习的第二周已经过来了,先总结一下,感觉学习h5是一件让我爱恨交加的事,学会一些新的知识并把它成功运行出来的时候是非常激动和兴奋的,但是有时候搞不懂一个标签或者属性的时候,就有 ...
- H5学习笔记1
H5学习笔记 1.创建超链接: target=”_blank”:链接的目标网页会在新的窗口中打开. target=”_parent”:链接的目标会在当前窗口中打开,如果在框架网页中,则会在上一层框架打 ...
- 2017.3.12 H5学习的第一周
本周我开始了H5的学习,在这一周里我们从html的基本标签开始一直讲到了才算css的用法,接下来我将记录下来本周我学到的H5的内容. 首先是声明文档,声明文档类型是HTML5文件,它在HTML文档必不 ...
- H5学习第一周
已经接触H5一个周了,经过学习,总算对H5有了一些了解和认知,下面就总结一下我对H5的认知和感悟. 首先接触的是H5的常用标签[meta],它有其以下常用属性 1.charset属性.单独使用,设置文 ...
- H5学习之--前端和PHP后端的简单交互
最近在学习前端的东西,H5+CSS3+JS,又分别学习了原生JS和jQuery库,还有Bootstrap框架,因为我是做ios开发的,所以先熟悉WebApp相关的开发知识,其他的学习资料,网上有很多的 ...
- H5学习系列之Geolocation API
获取位置信息途径: 1.IP地址地理定位数据 2.GPS地理定位数据 3.WI-FI地理定位数据 4.手机地理定位数据 无废话直接上重点:navigator.geolocation对象就是获取地理位置 ...
- H5学习系列之Audio和Video
1.视频文件:音频轨道.视频轨道和一些元数据(视频封面.标题.子标题.字幕等相关信息). 2.目前H5还不支持的:流式音频和视频(H5对视频的支持只限于加载的全部媒体文件).H5的媒体收到跨域资源共享 ...
- H5学习小结——div+css创建电子商务静态网页
使用Sublime Text软件编写电子商务类网站静态形式首页 经过差不多一星期的学习,基本掌握了div+css的用法之后,开始了实战练习.首先要做的就是要练习一下一般电子商务网页的编写,我做的是下图 ...
随机推荐
- 前端学PHP之语句
× 目录 [1]if语句 [2]switch [3]while[4]do-while[5]for语句[6]foreach[7]break[8]continue[9]goto 前面的话 任何 PHP 脚 ...
- 基于Fragment的百度地图框架的使用
博客:http://blog.csdn.net/developer_jiangqq (一)基本介绍(Fragment和SupportMapFragment): Fragment的使用现在安卓APP开发 ...
- 关于SubSonic3.0生成的表名自动加复数(s)的“用户代码未处理SqlException,对象名'xxxs'无效”异常处理
使用SubSonic3.0模版生成时,同2.2版本一样,都会自动在一些类似数据库要用到的关键后面加要s(复数),这里也是3.0的一个小Bug,在查询时由于插件并没有完全的去掉s,所以会产生“用户代码未 ...
- 本地maven仓库使用及配置
本地仓库的创建 下载 nexus-2.11.4-01-bundle.zip 解压并运行C:\nexus-2.11.4-01-bundle\nexus-2.11.4-01\bin\jsw\windows ...
- mysql表名查询sql
select table_schema,table_name,engine from information_schema.tables where table_schema not in('info ...
- SYSTEM表空间AUD$使用空间过大问题处理
问题现象:SYSTEM表空间使用率超99%,前期设计时SYSTEM表空间是10G固定大小不允许自动扩展. 1.查询SYSTEM表空间的使用率 set linesize 200 col TABLESPA ...
- Front End Developer Questions 前端开发人员问题(一)
问题来源:http://markyun.github.io/2015/Front-end-Developer-Questions/ 1.Doctype作用?严格模式与混杂模式如何区分?它们有何意义?答 ...
- [Java IO]06_JSON操作
6.1 JSON 知识背景 6.1.1 JSON 简介 JSON: JavaScript Object Notation(JavaScript 对象表示法) JSON 是存储和交换文本信息的语法.类似 ...
- Django 1.10 中文文档------3.2.2 查询操作making queries
3.2.2 查询操作 6.15章节包含所有模型相关的API解释. 后面的内容基于如下的一个博客应用模型: from django.db import models class Blog(models. ...
- SqlSugar ORM已经支持读写分离
目前只有MYSQL版 3.5.2.9 支持,其库版本12月3号更新该功能 用例讲解 using (var db = new SqlSugarClient("主连接字符串", &qu ...