給不同的ID的菜單部分和頁腳部分

HTML給不同的ID的菜單部分和頁腳部分

首頁

新聞

照片

影片

附表

鏈接

來源

2016-03-02 hell123

嗨，你面臨哪個問題？ –

我在CSS中問題。我把背景和編碼，但我看不到任何背景圖像在屏幕上。此外，我做了CSS菜單部分的編碼，但它也影響頁腳部分。我認爲是因爲li標籤。 – hell123

請保留ul和div的不同類。因爲它將適用於菜單的ul和div。可能是你面臨的一些問題。 –

<ul id="HeaderMenu"> 
<li><a href="#">Home</a></li> 
<li><a href="#">News</a></li> 
<li><a href="#">Photos</a></li> 
<li><a href="#">Videos</a></li> 
<li><a href="#">Schedule</a></li> 
<li><a href="#">Links</a></li> 
<li><a href="#">Contact</a></li> 
</ul> 


<ul id="footerMenu"> 
<li><a href="#">Home</a></li> 
<li><a href="#">News</a></li> 
<li><a href="#">Photos</a></li> 
<li><a href="#">Videos</a></li> 
<li><a href="#">Schedule</a></li> 
<li><a href="#">Links</a></li> 
<li><a href="#">Contact</a></li> 
</ul>

而且在CSS單獨解決這些問題，因爲這：

body{ 
    background: #cccccc url("http://www.paradise.lk/images/pattern.png") no-repeat; 
    width: 100%; 
    height:auto; 
} 
h1 { 
    text-align: center; 
} 
p.text{ 
    text-align: center; 
} 


#HeaderMenu li { 
    float: left; 
} 

#HeaderMenu li a { 
    display: block; 
    color: white; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
} 

#HeaderMenu li a:hover:not(.active) { 
    background-color: red; 
    color:black; 
} 


#footerMenu li { 
    float: left; 
} 

#footerMenu li a { 
    display: block; 
    color: white; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
} 

#footerMenu li a:hover:not(.active) { 
    background-color: #2d6a05; 
    color:black; 
} 

ul.HeaderMenu { 
    list-style-type: none; 
    margin: -1px; 

    overflow: hidden; 
    background-color: #156611; 
} 
ul.footerMenu { 
    list-style-type: none; 
    margin: -1px; 

    overflow: hidden; 
    background-color: #156611; 
} 



#logo img { 
    height: 90px; 
    width: 212px; 


} 
.box { 
    background-color: #4b4244; 
    width: 300px; 
    padding: 25px; 
    margin: 25px; 
} 
.box1 { 
    background-color:white; 
    width: 300px; 
    padding: 25px; 
    margin: 25px; 
}

現在做您的樣式分別爲頁眉和頁腳的菜單。

來源

2016-03-02 10:12:03 Bishan

我試過你的標籤解決方案，但它不再工作。你能編輯 – hell123

謝謝它適合我！ – hell123

檢查新的更新。必須工作。 – Bishan

body{ 
    background: #cccccc url("http://hdnaturewall.com/wallpaper/2015/10/sky-blue-wallpaper-background-18-desktop-background.jpg") no-repeat 0px -501px; 
}

來源

2016-03-02 10:17:35

給不同的ID的菜單部分和頁腳部分

回答

相關問題