标题将包含的 div 从顶部向下推?

2024-03-07

我对 stackoverflow 和 Web 开发都是新手。尝试在没有任何帮助的情况下学习。我正在尝试创建一份简历,作为磨练我的技能的一部分。事情是这样的。

我的包含 div 下的第一个 div 是带有 id 的 divheader。我已将包含的 div 修复为顶部margin: 0 auto;它工作正常,我的嵌套中没有文本div(标题)但是一旦我在(标题)中写了一些东西div它推动标题div向下,因为 header 是第一个div/包含中的元素div,它也将其推低。

这是我的HTML:

body {
  margin: 0;
  font: normal 12px/18px'Helvetica', Arial, sans-serif;
  background: #44accf;
}
/* Positioning Rules */

#container {
  width: 900px;
  margin: 0 auto;
}
#header {
  background: #b7d84b;
  height: 50px;
  text-align: center;
  color: #ddd;
  line-height: 50px;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en">

<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Did We?</title>
  <link href="didwe.css" type="text/css" rel="stylesheet" />
</head>

<div id="container">
  <div id="header">
    <h1> Mansoor Zia </h1>	

  </div>
</div>
<!--container-->
</body>

</html>

我无法在此处附加图片,因为我是最新成员。


Add h1{margin:0}到你的CSS,这解决了你的问题。正如您所知,除非另有定义,否则所有文本元素都有边距,这些边距与定位和大小有关:)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

标题将包含的 div 从顶部向下推? 的相关文章

随机推荐