2013-03-20 58 views
1

我開始設計我的投資組合,我有這個問題,我設置了一個背景圖案,但我想在這個圖案上再添加1個顏色和1個切片圖像。我開始編寫代碼,一切都很好,除了我的導航菜單和其他東西都在我添加的這種顏色和圖片之下。這是HTML代碼和CSS。請幫忙?!?HTML 5背景在導航菜單上?

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Wrapping up HTML5</title> 
    <link rel="stylesheet" type="text/css" href="css/style.css" /> 
</head> 
<body> 
<div id="top-wrap"> 
<div id="cornerfill"><div class="fillmask"></div></div> 
    <div id="fillright"><div class="rightfill"></div></div> 
</div> 
<div id="wrapper"> 
<header><h1>Using a HTML5 wrapper</h1></header> 
    <section> 
     <article> 
      <hgroup> 
      <h1>This is actually legal</h1> 
      <h2>Just wrap everything in a div, just like before</h2> 
      </hgroup> 
      <p>But it's probably better to simply use the body tag.</p> 
     </article> 
    </section> 
    <footer><p>Love from Kebman</p></footer> 
</div> 
</body> 
</html> 

CSS

@charset "utf-8"; 
/* CSS Document */ 


html 
{ 
    width:100%; 
    height:100%; 
} 


body { 
    width: 100%; 
    height: 100%; 
    min-width:960px; 
    min-height:600px; 
    margin: 0; 
    padding: 0; 
    background: #FFF url(../img/bg.png) fixed; 
} 

#cornerfill 
{ 
    position:fixed; 
    top:0; 
    left:0; 
    width:50%; 
    height:100% 
     } 

#cornerfill .fillmask 
{ 
    width: 100%; 
    height: 100%; 
    background-color:#070707;} 

#fillright { 
    position:fixed; 
    top: 0; 
    right: 0; 
    width:50%; 
    height: 100%; 
} 

#fillright .rightfill 
{ 
    margin-left:-20px; 
    width: 600px; 
    height: 100%; 
    background:url(../img/bgup.png) left bottom no-repeat; 
} 

#wrapper{ 
    width: 960px; 
    margin: 0 auto; 

    } 
header 
{ width:auto; 
height:auto; 
background:#FFF;} 

#top-wrap 
{ 
    width:100% 
    height:40% 
    } 
+0

請向我們提供一個[的jsfiddle(http://jsfiddle.net),以更好地說明問題 – user2129623 2013-03-20 21:50:08

+0

拋出一些不透明屬性爲你的背景 – 2013-03-20 21:53:20

回答

0

嘗試應用z-index來控制頁面上的元素的層次感。

+0

謝謝你這是工作:) – Stoqn 2013-03-21 10:14:53

+0

接受呢? :) – Adrian 2013-03-21 13:47:13

+0

我應該接受什麼? – Stoqn 2013-03-21 16:06:35