Question

我正在创建一个Dreamweaver网站，在我的模板中，我创建了一个带有div标签#HeaderBox的css样式表。我希望这是一个40％大小的屏幕，指定的像素数量很好。我想把这个盒子放在中心，但标签不起作用以下是模板的代码：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="../Styles.css" rel="stylesheet" type="text/css" />
</head>

<body>
<center>
<div id="HeaderBox"></div>
</center>
</body>
<html>

以下是styles.css的代码：

@charset "utf-8";
#HeaderBox {
font-family: "Lucida Console", Monaco, monospace;
font-size: 24px;
font-weight: normal;
font-variant: normal;
text-transform: capitalize;
text-decoration: underline;
background-position: center 40px;
border: 2px groove #CC6;
top: 0px;
text-align: center;
vertical-align: 10%;
width: 40%;
padding: 0%;
}

提前致谢。

Answer 1

将以下内容添加到#HeaderBox CSS

Margin: 0 auto;

上述内容是什么意思？首先，我们声明我们需要调整有问题的边距。 '0'实际上是这里的简写CSS（即：你可以做边距：0自动0自动;）这将完成同样的事情。但是有问题的0声明了顶部和底部边距，auto告诉浏览器让我适应你所说的元素周围的空间。

Dreamweaver居中Div标签：创建标题框

1 个答案: