H5学习
2016-06-02 19:08
465 查看
1、html{font-size:62.5%;}//不用font-size:10px的原因:(因为设了62.5%后就有
至于选择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(){})中
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(){})中
相关文章推荐
- HTML5学习之FileReader new FormData()
- html5<canvas>画图
- 12个不为大家熟知的HTML5设计小技巧
- H5实现的手机摇一摇
- HTML5
- Html5
- h5小游戏——HitRocket
- HTML5
- html5 canvas
- 关于html5的理解
- html5解决登录超时
- html5 viewport
- H5播放器
- 使用MUI/html5plus集成微信支付需要注意的几点问题
- 【HTML5/CSS/JS】A list of Font Awesome icons and their CSS content values(一)
- HTML5 Canvas 绘制椭圆与椭圆弧的实现
- HTML5 Web Workers
- HTML 5定稿一周年!你必须要重新认识HTML5了
- ccah-500 第13题Which three basic configuration parameters must you set to migrate
- web HTML5 调用摄像头的代码