在下面的代码中,我试图让h1元素具有最高利润率.当我将位置设置为在css中内联时,margin-top不会显示.但是,当我将其更改为内联块时,它确实如此.我想知道是否有人可以解释为什么会这样.谢谢.
编辑:这是jsfiddle中的代码:http://jsfiddle.net/pjPdE/
这是我的HTML:
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" href="MyFirstWebsite.css">
<title>
Max Pleaner's First Website
</title>
</head>
<body>
<h1>Welcome to my site.</h1>
</body>
</html>
这是CSS
body {
background-image:url('sharks.jpg');
}
h1 {
background-color:#1C0245;
display:inline;
padding: 6.5px 7.6px;
margin-left:100px;
margin-top:25px;
}
Jam*_*lly 16
CSS2规范的9.2.4节规定:
inline-block
此值使元素生成内联级块容器.内联块的内部被格式化为块框,元素本身被格式化为原子内联级框.inline
此值使元素生成一个或多个内联框.
进一步在CSS2规范(第9.4.2节)中,我们被告知内联元素仅尊重水平边距(证明):
在内联格式化上下文中,框从一个包含块的顶部开始一个接一个地水平排列.这些框之间会考虑水平边距,边框和填充.
之间的差inline和inline-block是inline元素为内联处理,而inline-block元件被有效地用作块(其是在视觉上直列彼此)处理.
块级元素同时涉及水平和垂直边距,而内联级元素仅涉及水平边距.
| 归档时间： |
|
| 查看次数： |
10738 次 |
| 最近记录： |