您的位置：首页 > 移动开发 > IOS开发

IOS开发笔记：关于HTML

2013-10-12 13:55 267 查看
1、元素居中
对于块级元素，设置margin:0 auto;

2、CSS中适配retain屏与ipad
适配retian屏：
@mediaonly screen and (-webkit-min-device-pixel-ratio : 1.5),only screen and(min-device-pixel-ratio : 1.5){
//在样式中要加上background-size:，如果宽度不确定，可以用auto
}
适配ipad：
@mediascreen and (min-device-width: 700px){
}
但如果要同时在ipad和retina屏，下面这样写是不行的！！！！

@mediaonly screen and (-webkit-min-device-pixel-ratio : 1.5),only screen and(min-device-pixel-ratio : 1.5),only screen and (min-device-width: 700px){
}

3、CSS判断移动设备
@mediascreen and (min-device-width: 700px)，移动设备上这里要使用screen。

4、javascript的位置
js文件如果有全局的调用，需要将其放在页面的最下方引用，页面还是从下到上顺序执行的，js也一样。

5、background-size的使用
一般设置成background-size:百分比 auto就行了，但这个百分比要跟这个div的width的百分比一样，这样图片显示出来的就正常了，如果还不能显示出来就修改background:url("../../image/areabg1.png")no-repeat
100% 82% fixed; 两个比例

6、body onload
<bodyonLoad="">这里onload方法在页面全部加载完才执行，而如下js代码：
<body>
<script></script>
</body>
这里面的script方法则在页面一边加载一边执行。
像这种ctx.drawImage(this,0, 0, this.width, this.height, 0,0,winWidth,winHeight);
页面加载完了也没画出来，则需要将方法放在onload里执行。

7、new Image延迟
newImage();是延迟加载的，所以drawImage时可能画布上去。

8、使用js设置背景图片时
varitems = document.getElementsByClassName("item");
for(vari; i<items.length; i++){
items[i].style.background= "url(../image/all2.png)";
items[i].style.backgroundPosition= "-50px -200px";
}
这样设置背景没有用
document.getElementById("about").style.background= "url(../image/all2.png)";
document.getElementById("about").style.backgroundPosition= "-50px -200px"; 这样子才可以

9、jquery报错
遇到使用jquery时导致某个property没有被定义，记住要将jquery对象转换成Dom对象。

10、viewport
viewport对网页的等比缩放，那为什么还有很多内容会布满全屏呢，因为哪些页面超出了屏幕的宽度，又不会自动换行，而其他的地方就会受影响。

11、元素宽度和高度获取
div里层的高和宽定义在css文件里然后引入进来，用document.getElementById("imgbg").style.width获取不到宽度。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航