zoukankan      html  css  js  c++  java
  • [转]position:fixed; 在IE9下无效果的问题

    本文转自:http://www.cnblogs.com/xinwang/archive/2013/04/06/3002384.html

    平常DIV+CSS布局时,position属性一般用absoulte|relative用到的比较多;昨晚在做到一个静态网页,在实现腾讯的空间头部的导航栏时用到position:fixed;属性---代码如下:

    复制代码
     1 <html>
     2     <head>
     3         <title></title>
     4     </head>
     5     <body style="margin:0;">
     6         <div style="position:fixed; top:0; left:0; 100%; background-color:#234533; height:30px; dispalay:inline;"></div>
     7         <div style="height:1000px;">
     8         </div>
     9     </body>
    10 </html>
    复制代码

    运行发现在Google Chrome,FireFox都可以的,但是在IE9就不行了很是郁闷,因为IE6以上的版本都是支持fixed的属性的;上网上找了好久没找到,因为不知道关键字该怎么搜,最后用最笨的方法,查看源码,一点点找最终发现以前被自己忽视的问题:HTML 里面的<!DOCTYPE>标签。 后果断在头部加上<!DOCTYPE HTML>解决;

    复制代码
    <!DOCTYPE HTML>
    <html>
        <head>
            <title></title>
        </head>
        <body style="margin:0;">
            <div style="position:fixed; top:0; left:0; 100%; background-color:#234533; height:30px; dispalay:inline;"></div>
            <div style="height:1000px;">
            </div>
        </body>
    </html>
    复制代码

     发现平常被自己忽略的问题,于是上W3SCHOOL上仔细看了下,发现DOCTYPE属性的选择有些时候是很重要的,会造成CSS失效等多种问题:

    希望可以对和我遇到相同问题的有所帮助http://www.w3school.com.cn/tags/tag_doctype.asp

  • 相关阅读:
    BZOJ 3744 Gty的妹子序列
    BZOJ 3872 Ant colony
    BZOJ 1087 互不侵犯
    BZOJ 1070 修车
    BZOJ 2654 tree
    BZOJ 3243 向量内积
    1003 NOIP 模拟赛Day2 城市建设
    CF865D Buy Low Sell High
    CF444A DZY Loves Physics
    Luogu 4310 绝世好题
  • 原文地址:https://www.cnblogs.com/freeliver54/p/3664643.html
Copyright © 2011-2022 走看看