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;}
定位在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链接正常显示大小,写法:
<td align="center" style="background-color:#f1f1f1; height:150px;">
<table style=" 158px;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" style="height:64px;">
<a style="color:#f7e6e3;font-size:28px; text-decoration:none;" href="http://ehire.51job.com/Jobs/JobSearchPost.aspx" target="_blank">查看更多</a></td>
</tr>
</table>
</tr>
10.手机页面模版网页上下卡顿
原因:页面中用了大量的input输入框,一点输入框就影响页面滑动。少用input文本输入,影响页面滑动。最好把表单页面单独放一个页面独立起来,在主页面加链接跳转,可解决错频,输入法问题。
点击输入框,下面显示小键盘,最下面的Logo图片会被推上来。
原因:把图片放在跟表单内容放在一个DIV,不要用定位来控制图片,用margin, padding来控制距离