我有fixed header＆amp;容器内的div。容器内的div与标题重叠。我试过position: relative，但它没有按预期给我结果！
#syllabus_container {
background:#ADC;
left:0;
position:relative;
width:100%;
top:0;
}
答案 0 :(得分：0)
请在css下方使用，使用z索引将其显示在顶部，您可以在下面的链接中查看
https://www.w3schools.com/code/tryit.asp?filename=FLOPWZTB16T2
#header_container {
background: #ABC;
height: 75px;
left: 0;
position: fixed;
width: 100%;
top: 0;
z-index: 99999999999999;
}
答案 1 :(得分：0)
检查下面的代码。希望它有帮助
.header{
position:fixed;
width:100%;
top:0;
left:0;
height:70px;
background:pink;
text-align:center;
color:#fff;
font-size:20px;
z-index:9;
}
.content{
margin-top:72px;
}<div>
<div class="header">The header</div>
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ipsum lectus, rhoncus pretium lectus ac, laoreet dignissim nibh. Proin eleifend malesuada dapibus. Nunc quis arcu id nibh posuere sodales eu ac orci. Morbi bibendum efficitur odio vitae venenatis. In nec viverra tortor. Suspendisse non nibh ut sem commodo faucibus ut ut leo. Cras tincidunt ullamcorper nibh, ac bibendum leo volutpat ut.
Sed id ultrices ex. Aenean id laoreet mi. Aenean viverra sit amet risus sed tristique. Phasellus varius massa eu vestibulum euismod. Etiam vel velit ut purus ornare accumsan. Maecenas vulputate eu tellus a egestas. Vivamus maximus imperdiet risus, non posuere ante lobortis sed. In faucibus aliquam odio. Maecenas et mollis purus, at luctus lectus. In eget nibh quam. Duis in tempor nisl, ac imperdiet erat. Nam condimentum consectetur sapien. Nullam non urna vitae est convallis rhoncus vitae nec enim.
Phasellus ullamcorper egestas metus, in imperdiet magna blandit id. Fusce eu magna in ante aliquam congue. Pellentesque euismod turpis eu lorem rhoncus, sed condimentum elit cursus. Suspendisse at feugiat erat. Duis malesuada ligula sed felis rutrum mattis. Donec ac magna dictum, vehicula tellus ut, tristique ligula. Quisque quis congue sapien, eu laoreet tortor. Pellentesque commodo metus diam, non egestas quam dignissim nec. Curabitur non velit purus. Pellentesque mauris velit, imperdiet vel imperdiet quis, viverra ut leo. Ut eget malesuada libero. Sed tristique metus commodo fermentum tristique. Cras accumsan massa vitae dolor scelerisque, eu tincidunt mauris venenatis. Ut in purus vitae risus aliquam mattis. Cras cursus maximus elit, tempor pretium urna congue in.
Nulla facilisi. Sed feugiat elementum enim, et posuere dolor tempus pharetra. Nulla a orci eget lorem tincidunt aliquam id id nulla. Morbi facilisis eget elit in volutpat. Aliquam sed luctus enim, id aliquam nunc. Pellentesque eu elit dui. Proin ornare tempor eros, vitae faucibus sapien placerat a. Mauris volutpat feugiat est a finibus. Phasellus in mattis diam. Mauris vitae dignissim dui. Proin tincidunt arcu sit amet pretium tristique. Mauris ullamcorper at neque eget euismod. Nam massa massa, mattis quis risus vitae, elementum lobortis justo.
Nam eu est non dui molestie fringilla. Aliquam ullamcorper elit ligula, quis vestibulum lectus auctor vitae. Nulla a blandit sem. Nulla mauris nisl, molestie sed dolor nec, feugiat imperdiet orci. Ut commodo at metus in gravida. Vivamus sed sapien auctor, molestie est in, ullamcorper diam. Mauris molestie quam non venenatis laoreet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum a tempus erat. Maecenas dui orci, malesuada a vulputate ac, egestas ac ante. In dolor quam, ornare eget tincidunt sit amet, mattis at diam. Etiam nec malesuada magna.
Nam vitae risus mi. Maecenas faucibus purus sed arcu posuere, ut eleifend risus facilisis. Integer suscipit, tortor eu malesuada porttitor, tortor sem laoreet enim, vitae tincidunt velit nisl sed turpis. Praesent magna velit, auctor vel mattis gravida, fermentum ut turpis. Vivamus nisl dui, ullamcorper nec convallis vitae, suscipit ut mi. Curabitur condimentum in leo congue consectetur. Praesent sit amet massa hendrerit, pretium lectus quis, egestas augue. Mauris ac pretium purus, eget fermentum nulla. Vivamus sed est massa. Praesent vitae nisl sed nisl porta vestibulum. Donec maximus facilisis urna, nec semper urna suscipit quis. In nisi turpis, suscipit eu elit vitae, consectetur lobortis mi.
Proin ut orci diam. Ut venenatis eget leo nec mollis. In ut lorem vel dolor mollis feugiat. Pellentesque quam risus, aliquet vitae ultricies id, sodales eu risus. Vestibulum sodales non sapien a cursus. Aenean sapien nunc, aliquet in metus quis, viverra mollis nisl. Pellentesque eu hendrerit lacus, id consequat enim. Nulla lectus erat, congue non turpis in, ornare dapibus ex. In in molestie mi. Nunc sagittis, ante nec finibus aliquam, sem est molestie ipsum, at interdum dolor neque nec dolor. Cras et lectus accumsan, volutpat felis sed, vehicula enim.
Sed vitae lacinia neque. In eleifend ex vestibulum sem gravida, vitae pellentesque mi laoreet. Nulla placerat mauris at viverra pulvinar. Nunc ut ante ante. Aliquam in vehicula diam. Sed mauris neque, porta vitae sagittis vel, dapibus sed ligula. Mauris magna orci, maximus ac dictum eget, auctor vitae nisl. Vestibulum hendrerit sem vitae mi cursus, quis consectetur est hendrerit. Sed id metus fringilla, mattis est vel, cursus ligula. Sed non auctor lorem, at facilisis ipsum. Mauris venenatis accumsan lacus, et ornare purus cursus at. Suspendisse lacinia porttitor tincidunt. Sed vitae diam leo. Pellentesque eu malesuada libero. Cras varius ultrices augue, at ullamcorper nunc tristique non.
Curabitur et molestie justo. Pellentesque et neque quis risus efficitur porttitor at eget odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam elit libero, dignissim quis rhoncus sed, aliquam non ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec convallis erat tempus pretium tempus. Ut vehicula ipsum leo, vehicula dignissim dui dignissim et. Vivamus et lacinia magna.
Integer a diam purus. Maecenas condimentum quam convallis tincidunt vestibulum. Proin vestibulum ut leo elementum hendrerit. Sed diam mi, vehicula sed auctor sit amet, fringilla vitae augue. Curabitur magna eros, maximus et erat et, sodales accumsan tellus. Sed sagittis felis facilisis dolor euismod, ut dictum nulla convallis. Sed massa nulla, sodales malesuada pellentesque sagittis, vehicula id ligula. Nunc bibendum, odio sit amet suscipit porttitor, dui sapien consectetur libero, in ultrices justo dolor ac nulla. Cras gravida orci nec leo aliquam maximus. Vestibulum quis lobortis sapien. Integer pharetra elit enim, a hendrerit leo porta a. Phasellus efficitur enim vitae laoreet posuere. Nullam eu quam pellentesque, commodo enim a, venenatis turpis. Donec pulvinar eleifend urna, in tincidunt lorem imperdiet ut.
Nam id orci sit amet ante aliquam tincidunt ut vel nisi. Fusce ornare nibh lacus, non sagittis arcu lobortis eu. Nulla purus dui, viverra in sodales vitae, commodo at odio. Aliquam dignissim lacus quis velit fringilla ultrices. Aliquam nisi lectus, consequat quis risus et, pulvinar malesuada nisl. Cras lobortis magna id volutpat imperdiet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut eget porta lacus, quis condimentum turpis.
In vitae porttitor purus. Aliquam ullamcorper metus eget urna maximus, non viverra mi tempor. Proin elit nisi, cursus a blandit vitae, dignissim in lorem. Vestibulum sollicitudin tellus placerat porttitor molestie. In hac habitasse platea dictumst. Nulla venenatis tortor sit amet ex venenatis, in consequat quam dictum. Donec pellentesque nunc et ipsum fringilla, ac lobortis risus sagittis.
Morbi pretium, nibh eu fermentum porta, nunc diam sagittis urna, sed rhoncus purus mi at magna. Nam pulvinar, justo a efficitur ultrices, arcu libero finibus massa, nec blandit nisi ipsum sed neque. Integer venenatis purus velit, nec malesuada ipsum iaculis nec. Cras consequat orci orci, ac aliquam dui laoreet sed. Fusce feugiat ligula in dapibus rhoncus. In sed suscipit arcu. Nam varius varius orci, id dictum urna pellentesque finibus. Phasellus non ex vitae diam tristique egestas. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum finibus quam nec ligula iaculis, vitae maximus nulla aliquet. Nullam faucibus lacinia sollicitudin. Ut hendrerit cursus velit, et vestibulum elit sagittis nec.
Morbi tempor commodo eros ac posuere. Nunc rhoncus tempus neque, eget laoreet mi aliquam at. Maecenas eget metus finibus, fringilla enim pellentesque, rutrum ante. Donec nec mollis sem. Maecenas in ante malesuada, molestie felis eu, euismod neque. Nam dui magna, gravida non orci vel, suscipit pharetra nulla. Pellentesque in sem porta, auctor arcu ut, tincidunt diam. Aenean commodo massa ut lectus mollis viverra. Praesent ultrices ac lorem in aliquet. Aenean interdum, nisl quis hendrerit venenatis, arcu est placerat felis, a mattis ligula justo ut ligula. Sed dictum felis tellus, id vulputate mauris pellentesque sit amet. Vivamus at turpis iaculis, dictum eros at, pellentesque magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc tincidunt sapien in tincidunt rutrum. Maecenas tincidunt lacus at est scelerisque, vel laoreet urna viverra.
Etiam aliquam, elit nec dictum auctor, purus libero sollicitudin erat, nec malesuada mi ex at massa. Cras ac lorem sed nibh dignissim lobortis. Quisque auctor consectetur enim sit amet ultricies. Nullam nec mauris nibh. Morbi at venenatis neque. Maecenas velit nisi, sodales non lorem ac, pellentesque sodales justo. Morbi sed placerat diam, ut tristique arcu. Aenean sapien risus, ultrices quis porttitor commodo, elementum vestibulum lacus. Phasellus eleifend in orci in feugiat. Morbi iaculis, ex sed sollicitudin eleifend, neque tellus sodales metus, a elementum dui ipsum id massa. Suspendisse cursus ut quam id consectetur. Suspendisse potenti. In eu libero est. In vulputate dictum lacus, quis sodales nulla iaculis quis. Nullam sodales mollis tortor, at vulputate augue accumsan sed. Donec sagittis massa enim, eget laoreet arcu tristique eu.
</div>
</div>