知识点手记二

1.3像素问题及解决办法

　　当使用float浮动容器后，在IE6下会产生3px的空隙，有意思的是右侧容器没设置高度时3px在右侧容器内部，当设定高度后又跑到容器的左侧了。

　　解决方法有几种，对于网上非常流行的给右侧div增加margin-right: -3px我不是很赞同，大大增加了布局的复杂度并且如果父div有设置浮动的话就会失效，

　　简单高效的解决办法是在父div里设置overflow:hidden。

IE6下这两个层中间怎么有间隙
这个IE的3PX BUG也是经常出现的，解决的办法是给.right也同样浮动 float:left 或者相对IE6定义.left margin-right:-3px;

2.自适应：<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=false;" name="viewport">

苹果4 @media screen and (max- 350px) {.title3{ padding-top:0px;}

.time{ padding-top:20px;}

.apply{ padding-top:20px;}}

两个条件连接中间用and连接。例如：@media screen and (min- 350px)and(max-500px) {.title3{ padding-top:0px;}

3. IE6相对父容器绝对定位的bug及其解决办法

定位在IE6偏移或者不显示问题解决方法：

解决办法有两种：
　　1、给父层设置zoom:1触发layout。 （解决）
　　2、给父层设置宽度（width(定位left)/height(定位bottom)）。

4.给table表格加padding,IE6.7没反应。

注释：在IE6/7不能给table加padding,可以加margin;不能给td加margin,可以加padding.

解决办法：给第一个或者最后一个TD写Hack，padding值。（案例：邮件设计稿表格部分IE6/7）

5.图片之间IE6.7有空白间距。解决办法：给图片加display:block;border:0;

IE6下为什么图片下方有空隙产生
　解决这个BUG的方法也有很多，可以是改变html的排版，或者定义img 为display:block
　或者定义vertical-align属性值为vertical-align:top | bottom |middle |text-bottom
　还可以设置父容器的字体大小为零，font-size:0

6.块中放文字图片，居中对齐问题。给块设置了行高、高度，图片设置了vertical_center:middle;IE6不对齐。

原因：图片本身高度与文字不同。

解决办法：给块加背景图片，这样IE6就居中对齐了。

7.表格内容对齐-td

水平对齐用align="center" 垂直对齐用Valign="middle"

8.邮件页面第一个table想在outlook里居中，加align=”center”

这个命令在IE里是居中的。但火狐，谷歌不居中。想要让邮件页面在所有浏览器里居中，outlook，QQ邮箱里居中，同时加宽度magin:0px auto， align=”center”。Ps:magin:0px auto对邮件没效果。

9.邮件页面A链接正常显示大小，写法：

<tr>

</tr>

</table>

</tr>

10.手机页面模版网页上下卡顿

原因：页面中用了大量的input输入框，一点输入框就影响页面滑动。少用input文本输入，影响页面滑动。最好把表单页面单独放一个页面独立起来，在主页面加链接跳转，可解决错频，输入法问题。

点击输入框，下面显示小键盘，最下面的Logo图片会被推上来。

原因：把图片放在跟表单内容放在一个DIV，不要用定位来控制图片，用margin, padding来控制距离