【问题标题】:How can I make my CSS code compatible with all browsers? [closed]如何使我的 CSS 代码与所有浏览器兼容? [关闭]
【发布时间】:2012-08-19 01:57:42
【问题描述】:
 p {
        margin:0;padding:0;
    }
    p#error {
        color:#FF0000;
        text-align:center;
    }
    p#success {
        color:#3983C2;
        text-align:center;
    }
    div#nav {
        background-image:url('../img/nav.png');
        background-repeat:no-repeat;
        padding-top:5px;
        padding-bottom:5px;
    }
    div#nav, a {
        text-decoration:none;
    }
    body {
        margin:0 auto;
        width:600px;
    }
    div#login, div#register {
        background-image:url('../img/form.png');
        background-repeat:repeat-y;
        padding-top:5px;
        padding-bottom:5px;
    }
    div#login table, div#register table {
        margin:0 auto;
    }
    div#login table td, div#register table td {
        text-align:right;
    }
    div#login input#btn, div#register input#btn {
        background-image:url('../img/btn.png');
        border-style:none;
        width:70px;height:25px;
    }
    div#footer {
        background-image:url('../img/footer.png');
        height:30px;
    }

这是我的 CSS 代码。我不知道如何让这个 CSS 在其他浏览器中工作,目前我在 Chrome 中工作。我已经在网上搜索了很多相关信息的页面,但这些对我来说更难以理解。需要您的建议等。非常感谢!

【问题讨论】:

  • 首先:其他浏览器开始有问题吗?如果没有:完成。如果是这样:找出个别问题并单独解决。
  • @DanieleLupo 他们有不同的布局:(

标签: html css cross-browser


【解决方案1】:

您的 CSS 应该可以在所有浏览器中按原样工作。从浏览器到浏览器的显示可能不同。大多数开发人员使用重置来解决该问题。

CSS 重置

http://meyerweb.com/eric/tools/css/reset/

标准化

http://necolas.github.com/normalize.css/

【讨论】:

【解决方案2】:

问题在于每个浏览器为不同的项目添加了不同的默认边距、填充等。这意味着您可以在每个布局中获得轻微或很大不同的布局。

我喜欢做这样的 CSS 休息:

*{margin:0; padding:0}

【讨论】:

  • 这就是我所需要的?对不起,我还在学习中:)
【解决方案3】:

【讨论】:

  • 所以我将为每个浏览器创建不同的css? :(
  • 基本上是的,但是您可以通过添加 hacks 来编辑现有的 css(在 css-tricks.com/how-to-create-an-ie-only-stylesheet/…> 链接中描述的'hacks'..)
  • 不要添加黑客。尝试概括您的 CSS,使其在所有浏览器中都能正常工作。如果必须,请在无法概括的少数情况下使用特定于浏览器的样式表。不要使用黑客。
  • 别忘了为你的页面添加 DOCTYPE!!
  • @AugustineFrendz,您不需要为每个浏览器创建不同的样式表。 99% 的情况下,如果您的代码聪明且设计得当,您将只需要一个适用于所有浏览器的样式表。
猜你喜欢
  • 2012-06-12
  • 2013-03-03
  • 2012-05-27
  • 2012-09-07
  • 1970-01-01
  • 1970-01-01
  • 2017-01-14
  • 2011-04-21
  • 1970-01-01
相关资源
最近更新 更多