IOS开发笔记:关于HTML

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获取不到宽度。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值