[問題] position:absolute元素的顯示

看板Web_Design作者 (WaitForU)時間9年前 (2016/06/16 22:23), 編輯推噓1(106)
留言7則, 4人參與, 最新討論串1/1
最近在學設計網頁時時,遇到CSS position的問題 以下程式是我參考寫出來的一個header <!DOCTYPE html> <html class="no-js" lang="ja"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Test</title> <link rel="stylesheet" href="./css/normalize.css"> <style> html { font-family: "Ropa Sans", sans-serif; font-size: 16px; line-height: 1.5 ; } body { background-color: rgb(240, 240, 240); color: rgb(0, 0, 0); min-width: 9 60px; padding-top: 240px; } h1, h2, h3, p, ul { margin: 0; } ul { padding-left: 0; } ul li { list-style-type: none; } a { color: inherit; text-decoration: none; } /* * header */ .page-header { background-color: rgb(255, 255, 255); position: absolute; width: 100%; min-width: 960px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); } .page-header > .inner { margin: auto; width: 960px; } .no-boxshadow .page-header { border-bottom: 1px solid rgb(204, 204, 204); } /* Primary nav */ .primary-nav { float: right; line-height: 65px; letter-spacing: 1px; text-transform: uppercase; } .primary-nav li { float: left; } .primary-nav a { display: block; padding: 0 2em; } .primary-nav a:hover { background-color: rgb(240, 240, 240); } </style> </head> <body> <header class="page-header" role="banner"> <div class="inner"> <nav class="primary-nav" role="navigation"> <ul> <li><a href="./">About</a></li> <li><a href="./">Work</a></li> <li><a href="./">Blog</a></li> <li><a href="./">Recruit</a></li> <li><a href="./">Contact</a></li> </ul> </nav> </div> </header> </body> </html> 請問各位大大們 為什麼每次當我把.page-header的position:absolute拿掉時,在網頁上就看不到.page-h eader背景的白色? 為什麼一定要加回去才會顯示? -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 27.245.15.143 ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1466087039.A.6A8.html

06/17 09:26, , 1F
你的normalize.css裡面是什麼?
06/17 09:26, 1F

06/17 15:24, , 2F
通常元素重疊都會用absolute 你拿掉的話元素就不知道被擠到
06/17 15:24, 2F

06/17 15:24, , 3F
哪 可以用開發者工具看元素跑去哪了
06/17 15:24, 3F

06/17 17:46, , 4F
Normalize.css沒有影響到
06/17 17:46, 4F

06/17 17:47, , 5F
回ccvs : 沒加的話,整個元素高度變成0
06/17 17:47, 5F

06/18 09:18, , 6F
float 就是這樣,沒有為什麼 @@ 要嘛大家一起飄,要嘛
06/18 09:18, 6F

06/18 09:18, , 7F
在最後插入一個元素加入 clear:both 也可以
06/18 09:18, 7F
文章代碼(AID): #1NOhP_Qe (Web_Design)
文章代碼(AID): #1NOhP_Qe (Web_Design)