zoukankan      html  css  js  c++  java
  • 知识点手记二

    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链接正常显示大小,写法:

                   <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来控制距离

           

                         

      

  • 相关阅读:
    poj 3261 Milk Patterns
    poj 3292 Semi-prime H-numbers
    bzoj千题计划256:bzoj2194: 快速傅立叶之二
    bzoj千题计划255:bzoj3572: [Hnoi2014]世界树
    bzoj千题计划254:bzoj2286: [Sdoi2011]消耗战
    bzoj千题计划253:bzoj2154: Crash的数字表格
    扩展BSGS算法
    bzoj千题计划252:bzoj1095: [ZJOI2007]Hide 捉迷藏
    bzoj千题计划251:bzoj3672: [Noi2014]购票
    bzoj千题计划250:bzoj3670: [Noi2014]动物园
  • 原文地址:https://www.cnblogs.com/gzya/p/5091776.html
Copyright © 2011-2022 走看看