javascript - ie9 与现代 html 和 css 语言的兼容性(跨浏览器 CSS)

标签 javascript html css internet-explorer cross-browser

<分区>

我做了一个超基本的页面,由几个 div 和一组 css 规则组成。

它与我在过去 2 年中见过的所有浏览器都完美兼容。因为我是网络新手,所以我不知道旧浏览器可以处理什么。我知道 html5 、 javascript 、 webgl 等现代脚本不适用于旧浏览器。然而,正如我所说,这个页面非常简单。奇怪的是它适用于旧版本的 chrome 和 firefox。但是ie9完全不能处理大部分的css规则...

<style media="screen" type="text/css">
    #main
    {
     padding:0;
     margin:0;
     width:100%;
     background-image:url(http://www.sisecam.com.tr/ik/index1.4.1.png);
     background-repeat:no-repeat;
     background-size:100%;
     background-color:white;
    }
    #warningmsg
    {
    position:relative;
    left:40px;
    top:30px;
    }
    #locatordiv
    {
    position:relative;
    top:436px;
    }
    #yellowribbon
    {
    width:100%;
    height:320px;
    background-image:url(http://www.sisecam.com.tr/ik/index1.4.3.png);

    background-repeat:no-repeat;
    background-color:#f5c11f;
    }
    #loginbutton
    {
     margin:0;
     padding:0;
     width:100%;
     display:block;
     height:35px;
     position:relative;
     left:85px;
     top:50px;
    }
    #logo
    {
        margin-left:auto;
        margin-top:90px;
        background-image:url(http://www.sisecam.com.tr/ik/logo.png);
        background-repeat:no-repeat;
        width:100px;
        height:100px;
        position:relative;
        right:20px;
    }
    .title
    {
        position:relative;
        left:20px;
        top:2px;
        font-size:15px;
        color:#FFF;
    }
    .input
    {
        display:block;
        height:25px;
        width:160px;
        background-size:200 40;
        background-repeat:no-repeat;
        margin-top:34px;
        position:relative; 
        top:55px;
        left:65px;
    }
    input
    {
        font-size:17px;
        width:170px;
        height:20px;
        border-style:none;
        padding:0;
        outline:none;
    }
    body 
    {
     background:white;
    }
    input[type="submit"] {
     opacity:0;
     width:inherit;
     height:inherit;
    } 
</style>

假设 ie9 可以处理 div 及其 id ...

我的主要问题是 css 兼容性。是否可以编写适用于 ie9 的 css 规则,因为它适用于其他浏览器?

任何建议都会有所帮助。

最佳答案

在编写语法正确的 HTML 时,您应该始终包含文档类型定义 (DTD),以告知浏览器它正在呈现的文档类型以及它是否应该应用特定的呈现规则。

当您在不同浏览器(尤其是 IE)上遇到某些显示问题时,这也是关键!

如果 DTD 不存在,IE 就会有一个“怪癖模式”——这会导致浏览器不应用任何呈现规则,并且许多样式(尽管已应用)看起来仍然不符合开发人员的期望。

关于javascript - ie9 与现代 html 和 css 语言的兼容性(跨浏览器 CSS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24260333/

相关文章:

html - 垂直居中元素而不会在屏幕外变得不可访问

html - 正方形元素符号列表错误的字体大小与正文 css

php - 本地主机中的 XAMPP 延迟

javascript - Objective-C 打印与 NodeJS 不同的特殊字符

javascript - JQuery 选择器在 Ruby on Rails 中由 Ajax XHR 创建的表中的元素上找不到类

jquery - 由于 Firebug ,不确定 jquery 是否在 <li> 元素上工作

javascript - HTML/CSS/JavaScript/jQuery - 在点击时保持悬停效果

javascript - 流畅快速的 Sprite 动画(CSS)

javascript - 使用 Zurb Foundation 4 时如何在移动设备上切换到桌面 View ?

javascript - 在 .click(function () {? 中使用 $.ajax