gpt4 book ai didi

css - 为什么这些元素在我的包装器之外?

转载 作者:太空宇宙 更新时间:2023-11-04 12:23:29 25 4
gpt4 key购买 nike

h1 和 p 应该在白色包装 div 的内部,我不明白为什么它们在外面,有人可以解释一下吗?不幸的是我不允许发布图片,但是 h1 和 p 将它们自己推到白色背景的 wrapper 之上......当我不使用标签时,文本突然在 wrapper 内

HTML:

<!doctype html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="stylesheet.css">
</head>

<body>
<p id='before-header'>This is the before header area</p>

<div id='wrapper'>
<h1>Why is this outside of the white box?</h1>
<p>and this as well?</p>
but when I dont use tags... suddenly its insider, what magical stupid mistake am I doing?
</div>
</body>

这是CSS:

*{
margin: 0 auto;
background-image: url('background.png');
}

#wrapper{
margin: auto;
width: 960px;
height: 2000px;
background: white;
}

#before-header{
text-align: center;
}

最佳答案

这是因为您在所有内容上都设置了背景图像,所以它看起来好像 h1 位于白框之外,实际上它位于白框顶部但带有背景图像,因此看起来好像它在白框外面。

css 中的星号 (*) 选择器覆盖了所有内容,因此可以专门针对您想要的背景图片:

body {
margin: 0 auto;
background-image: url('background.png');
}

Example of background targeting everything

Example of background targeting body only

关于css - 为什么这些元素在我的包装器之外?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28189649/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com