HTML / CSS文本移动div

时间:2014-03-12 01:43:52

标签: css html

我只是在学习CSS,我是一个汽车销售网站的项目,但我试图在div中定位文本,段落代码很好,但是当我放入H1标签时,它会将整个div移动? (见下文)。

https://www.dropbox.com/s/px0zv5xw8vqpvpd/Screenshot%202014-03-12%2001.38.02.png

<div id="bottom">

<h1> Welcome to JJMurray Car Sales </h1>

<p class="hometext">
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></div>

和CSS:

#bottom{background-color:#d6d6d6;width:100%;height: 450px;

h1
{
text-align: left;
    margin-left: 20px;
    margin-right: 20px;
}

p.hometext
{
font-size: 14px;
font-family: calibri;
text-align:left;
  width: 600px;
    float: left;
    margin-left: 20px;
    margin-right: 20px;

1 个答案:

答案 0 :(得分:1)

默认情况下,标题标签占用一些余量。 并且该默认边距使其显示为周围的空格。 所以,首先尝试给出h1标签margin:0;然后,您可以看到默认情况下它实际占用了多少空间。

由于它是一个块元素,您可以指定maring: top left bottom right;