Heim > Artikel > Web-Frontend > 很诡异的overflow:hidden 与fixed问题_html/css_WEB-ITnose
很诡异的overflow:hidden 与fixed问题_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:16:271948Durchsuche
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>test</title> <script type="text/javascript" src="http://img.jb51.net/jslib/jquery/jquery.js"></script> <style type="text/css"> body{padding:10px;margin:0;} #box{width:200px; height:200px; float:left; overflow:hidden;margin:0 auto; background:#9C0;} .box2{ width:200px; height:300px; overflow:hidden; background:#CCC; position:fixed;}</style> </head> <body> <div id="box"> <div class="box2"></div></div> </body> </html> #box高为200px，加上overflow:hidden理论上能对.box2超出部份隐藏，但实际上不尽人意，去掉.box2的position:fixed后就能隐藏超出部份了，在.box2的position:fixed不去掉的情况下求解决办法。
回复讨论(解决方案)
这个好像实现不了。
因为fixed 生成绝对定位的元素，相对于浏览器窗口进行定位，元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
除非你将position类型换成static、relative或inherit。
position:fixed;
将跳出标准文件流，也就是说fixed 是针对窗口本身的，因此设置 id="box" 的属性是无法生效的。你的用意是什么呢
W3C的官网明确规定了， position:fixed表示，这个div是相对于浏览器窗口来定位，
而不是受其他div影响，这个一点也不诡异，是你理解不到位吧。
最后给你引用下官网的参考： http://www.w3school.com.cn/css/pr_class_position.asp
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：我想做个下拉框链接，然后 让很多网页都来引用这个下拉框，这样下拉框改变后，引用他的都相应改变。_html/css_WEB-ITnoseNächster Artikel：快~~ 有经验的帮助看看呀 页面样式问题_html/css_WEB-ITnose