margin-bottom: 30px;
不适用于 .box 类。我试图在盒子下面添加一些额外的空间，但它不起作用。
我怎样才能解决这个问题？这是我的 HTML。还有什么我应该在代码中更改的吗？让它变得更好。
这是我的 HTML。 . . .
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<title>web</title>
<body>
<div id="container">
<div id="header"></div>
<div id="nav" class="navi"> <a class="navi" href="#"> Link </a>
<a class="navi" href="#"> Link </a>
<a class="navi" href="#"> Link </a>
<a class="navi" href="#"> Link </a>
<a class="navi" href="#"> Link </a>
<a class="navi" href="#"> Link </a>
</div>
<div id="content">
<div class="box">
<h1>Lorem ipsum</h1>
<h2>Sub heading</h2>
<p>dolor sit amet, epicurei neglegentur sit an, libris numquam ius ei. Appareat volutpat imperdiet no vim, ut suas aliquid sanctus quo. At duo quot essent suscipit. Vis an atomorum accusamus. Est at nemore ponderum. No nec voluptua conceptam, detraxit splendide disputando nam ea. Ne eum vocibus inimicus democritum, erant praesent eam in, agam ludus verterem an pro. Erant vidisse te vel, vim ei summo honestatis, no libris quidam inermis quo. Blandit sententiae no per. Ullum accumsan praesent usu ut, at usu verterem sententiae. Accumsan signiferumque et sit, id audiam patrioque vix. Ei accusam electram theophrastus eos, sea solet epicuri molestiae ad. No sanctus scriptorem vim. Simul voluptaria scripserit cu his, perfecto petentium cotidieque cu duo. Te mei case ullum assum, mei te sint fugit. Ut minim albucius invenire est, at nec sint utroque. Ei cum legimus fastidii democritum, sit expetenda gubergren ex. Ex dolorem scripserit has, sit in tation theophrastus. Sed veri viderer te, eos porro feugiat ut, mel sanctus impedit phaedrum id. No sit dicant denique adipisci, habemus scaevola mei ne, qui no solum idque verterem. Mei ut etiam everti atomorum. Vis ex tibique appetere, ei sed tota aperiri scripserit. Mei verterem antiopam constituam an, id quodsi tibique quo, detracto iudicabit similique ex his. Graece vocibus mediocrem no pri, cu odio suas his. Sea in fabulas oportere adversarium, eu eos quodsi latine fabellas.</p>
<<p>dolor sit amet, epicurei neglegentur sit an, libris numquam ius ei. Appareat volutpat imperdiet no vim, ut suas aliquid sanctus quo. At duo quot essent suscipit. Vis an atomorum accusamus. Est at nemore ponderum. No nec voluptua conceptam, detraxit splendide disputando nam ea. Ne eum vocibus inimicus democritum, erant praesent eam in, agam ludus verterem an pro. Erant vidisse te vel, vim ei summo honestatis, no libris quidam inermis quo. Blandit sententiae no per. Ullum accumsan praesent usu ut, at usu verterem sententiae. Accumsan signiferumque et sit, id audiam patrioque vix. Ei accusam electram theophrastus eos, sea solet epicuri molestiae ad. No sanctus scriptorem vim. Simul voluptaria scripserit cu his, perfecto petentium cotidieque cu duo. Te mei case ullum assum, mei te sint fugit. Ut minim albucius invenire est, at nec sint utroque. Ei cum legimus fastidii democritum, sit expetenda gubergren ex. Ex dolorem scripserit has, sit in tation theophrastus. Sed veri viderer te, eos porro feugiat ut, mel sanctus impedit phaedrum id.</p>
<h1>Extras</h1>
<p>No sanctus scriptorem vim. Simul voluptaria scripserit cu his, perfecto petentium cotidieque cu duo. Te mei case ullum assum, mei te sint fugit. Ut minim albucius invenire est, at nec sint utroque. Ei cum legimus fastidii democritum, sit expetenda gubergren ex. Ex dolorem scripserit has, sit in tation theophrastus. Sed veri viderer te, eos porro feugiat ut, mel sanctus impedit phaedrum id.</p>h1>Lorem ipsum</h1>
<h2>Sub heading</h2>
<p>No sanctus scriptorem vim. Simul voluptaria scripserit cu his, perfecto petentium cotidieque cu duo. Te mei case ullum assum, mei te sint fugit. Ut minim albucius invenire est, at nec sint utroque. Ei cum legimus fastidii democritum, sit expetenda gubergren ex. Ex dolorem scripserit has, sit in tation theophrastus. Sed veri viderer te, eos porro feugiat ut, mel sanctus impedit phaedrum id.</p>
</div>
</div>
</html>
</body>
这是我的 CSS。 . .
body {
background: url(images/heart.jpg) bottom left no-repeat fixed;
margin-bottom: 100px;
background-color:#c4c2c9;
}
#
text-transform:uppercase;
font-size: 12px;
font-family:"Times new Roman";
padding-left: 40px;
color:#FFFFFF;
text-decoration:none;
}
A:hover.navi {
color:#FFFFFF;
text-decoration:underline;
}
A:visited.navi {
color:#FFFFFF;
text-decoration:none;
font-size: 12px;
}
p {
word-spacing:3px;
font-size: 12px;
color:#050505;
font-family:"Times new Roman";
}
p2 {
word-spacing:3px;
font-size: 12px;
color:#050505;
font-family:"Times new Roman";
}
h1 {
text-transform:uppercase;
color:#050505;
font-family:"Times New Roman";
letter-spacing:10px;
font-size: 19px;
}
h2 {
text-transform:uppercase;
color:#050505;
padding-bottom: 3px;
border-bottom: solid 2px #d7d7d7;
font-family:"Times New Roman";
letter-spacing:10px;
font-size: 9px;
}
a:link {
color:##050505;
text-decoration:none;
font-size: 12px;
}
a:visited {
color:##050505;
text-decoration:none;
}
a:hover {
color:#050505;
text-decoration:underline;
}
a:active {
color:#050505;
text-decoration:none;
}
最佳答案
那是因为你的 .box 是绝对定位的，要增加额外的空间，请尝试调整 padding-bottom:
关于CSS 边距底部不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18371535/