我在我的第一個HTML和CSS項目中,代碼有自己的想法!簡單的CSS。水平菜單在位置固定時不保留其長度:固定
所以...我做了一個水平菜單。它顯示非常酷,整個頁面寬度的背景顏色。
但是,當我想使其位置:固定,以便它在頁面上停留時寬度很小時,背景顏色會從寬度中消失。
的HTML:
<div class="nav">
\t <ul>
\t \t <li class="selected"><a href="tema.html">Job Description Details</a></li>
\t \t <li><a href="">Audit Trail</a></li>
\t \t <li><a href="">Files</a></li>
\t </ul>
\t </div>
沒有固定的位置,它的偉大工程的CSS。
.nav {
background-color: #488AC7;
\t margin: none;
}
.nav ul {
\t margin: 0px;
\t list-style-type: none;
\t padding: 5px 0px 5px 0px;
}
.nav ul li {
\t display: inline;
\t padding: 5px 10px 5px 10px;
}
.nav ul li a:link, .nav ul li a:visited {
\t color: #F0FFFF;
\t border-bottom: none;
\t font-weight: bold;
}
.nav ul li.selected {
background-color: #F0FFFF;
border-bottom: none;
}
.nav ul li.selected a:link, .nav ul li.selected a:visited {
color: #488AC7;
}
和CSS代碼,使顏色消失:
.nav ul {
\t margin: 0px;
\t list-style-type: none;
\t padding: 5px 0px 5px 0px;
position: fixed;
margin-left: 0px;
}
你想與固定的位置來完成什麼?你可以將它應用到導航類而不是ul,它會使它修復。也可以使用top,left來確定頁面的位置 – ClearBoth
我試過將它應用到導航類,但它是相同的結果 - 背景顏色停止去完整的寬度,只粘貼到實際的名稱寬度。範圍是......呃......家庭作業要求表明它需要修復。因此,當滾動到正確的位置時,它會粘在頁面上。 – EmmaZ
你需要提供一個寬度的導航https://jsfiddle.net/2j8s8xfz/ – prakashchhetri