html – 尽管改变了“顶部”边距,但内容仍隐藏在固定标题下方

html – 尽管改变了“顶部”边距,但内容仍隐藏在固定标题下方,第1张

概述我最近改变了我的标题以保持固定.标题是完美的,但它隐藏了一半的内容.我尝试更改内容的“顶部”设置,但不会改变结果. HTML: <div class="gridContainer clearfix"> <div id="LayoutDiv1">We are here to help</div> <form action="website.php" method="POST"> <div 我最近改变了我的标题以保持固定.标题是完美的,但它隐藏了一半的内容.我尝试更改内容的“顶部”设置,但不会改变结果.

HTML:

<div >  <div ID="Layoutdiv1">We are here to help</div>  <form action="website.PHP" method="POST">  <div ID="Layoutdiv3">         names:           <input type="text" name="user"/>           Gender<Font color="#FF0000">*</Font>    <select name="Gender[]" double="double">             <option value="Female">Female</option>             <option value="Male">Male</option>    </select></div><div ID="Components"></div>  <div ID="Food"><h1>DIEtary conditions:</h1>  &nbsp;gluten Free  <input type="checkBox" name="glutenFree" value="Yes" />  <br>  &nbsp;&nbsp; Diary Free  <input type="checkBox" name="DairyFree" value="Yes" />  <br>  &nbsp;&nbsp; No Softdrink  <input type="checkBox" name="NoSoftDrink" value="Yes" />  &nbsp;<br>  &nbsp;Halal  <input type="checkBox" name="Halal" value="Yes" />  &nbsp;<br>  &nbsp;vegetarian  <input type="checkBox" name="vegetarian" value="Yes" />  &nbsp;&nbsp; <br>No Nuts<input type="checkBox" name="NoNuts" value="Yes" />  &nbsp; <br>  Other<input type="checkBox" name="Other" value="Yes" /></div>

CSS:

#Layoutdiv1 {    position: fixed;    height: 75px;    top: 0;    wIDth: 100%;    z-index: 10000;    background:#FFF}#Layoutdiv3 {    position: fixed;    height: 30px;    top: 75px;    wIDth: 100%;    z-index: 10002;    background:#FFF}#Components {top: 2000px; //Has no effect,and either does changing the 'top' setting for each div              within 'components. }

谢谢

解决方法 你需要改变顶部:到margin-top.

#Components {    margin-top: 120px; }

检查这个http://jsfiddle.net/Vj799/

注意:

top不适用于静态元素.

您可以使用top与position:relative | fixed | absolute

更多在这里https://developer.mozilla.org/en-US/docs/Web/CSS/top

总结

以上是内存溢出为你收集整理的html – 尽管改变了“顶部”边距,但内容仍隐藏在固定标题下方全部内容,希望文章能够帮你解决html – 尽管改变了“顶部”边距,但内容仍隐藏在固定标题下方所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1043016.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-24
下一篇 2022-05-24

发表评论

登录后才能评论

评论列表(0条)

保存