1

这里有点疯了。

这是jsfiddle:http: //jsfiddle.net/mersenneprimes/CvGKK/

注意“业务”在右上角。

现在这是我在html 文档中的相同代码。

这就是我得到的: http ://screencast.com/t/plAli1D3gpx

注意“业务”不在右上角。

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

    <STYLE TYPE="text/css">

        div {
            position:relative;
            width:400px;
            height:100px;
            border:3px solid orange;

        }

        p {
            position:absolute;
            top:0;
            right:0;
            background-color:green;
        }

    </STYLE>
</head>
<body>
    <div>
        <p>business</p> 
    </div>
</body>
</html>

但是,如果我改变

到 ,那么我做对了。

它正确地位于右上角。

4

1 回答 1

2

JSFiddle 上的 CSS 规范化包括:

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
    margin:0;
    padding:0;
}

你的 CSS 没有。添加

margin: 0;
padding: 0;

到你的 'div' 和 'p' CSS,你应该得到与 JSFiddle 相同的行为。

于 2012-04-05T02:21:28.217 回答