Question

我制作了一个简单的测试页。

HTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>

    <div id='test'>
        BORDER TEST!
    </div>

</body>
</html>

CSS：

body,
html{
    margin:0;
    padding:0;
}
div#test{
    border:1px solid #bbb;
    height:200px;
    width:500px;
    margin:10px auto;
}

这不起作用。而且我在目前正在开发的网站上遇到了这个问题。边框不能正确渲染或根本不显示。顺便说一下，IE8正在发生这种情况。

正确方向上的一点非常好。

PS：我已经尝试过更改doctypes，但在我的网站上，其他DTD仍然无法解决问题，实际上会导致更多问题。

Answer 1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

将您的doctype更改为高于1。我已经验证了IE 7到IE 9.所以肯定这会帮助你。：）

Answer 2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <style>
    body,
html{
    margin:0;
    padding:0;
}
div#test{
    border:1px solid #bbb;
    height:200px;
    width:500px;
    margin:10px auto;
}

</style>
</head>
<body>

    <div id='test'>
            BORDER TEST!
    </div>

</body>
</html>

这是我的榜样。这应该运行。

IE8不渲染边框

2 个答案: