導航欄邊框不會改變顏色

我想更改導航欄上邊框的顏色，但它不適用於我。這是我的代碼：導航欄邊框不會改變顏色

<!DOCTYPE html> 
<html> 
     <head> 
     <title> site </title> 
     </head> 
    <style type="text/css"> 
body 
    { 
     background-color:#75b5d6; 
     color:white; 
     font-family:"Arial"; 
     text-align:center; 
    } 
     a:link 
    { 
     color:white; 
    } 
     a:visited 
    { 
     color:white; 
    } 
     a:hover 
    { 
     color:white; 
    } 
     a:active 
    { 
     color:white; 
    } 
.nav 
    { 
     border:3px solid white; 
     border-width:0px; 
     list-style:none; 
     margin:2; 
     padding:2; 
     text-align:center; 
     background-color:orange; 
     font-family:"Bookman Old Style"; 
    } 
    .nav li{ 
    display:inline; 
    } 
.nav a 
    { 
    display:inline-block; 
    padding:10px; 
    } 
h1 
    { 
     font-size:40; 
     font-family:"Lucida Handwriting"; 
    } 
h2 
    { 
     font-size:27.5; 
     text-decoration:underline; 
    } 
p 
    { 
     font-size:12; 
    } 
    </style> 
     <body> 
     <h1> Kevril.net </h1> 
     <ul class="nav"> 
     <li><a href="x">Home</a></li> 
     <li><a href="x">site1</a></li> 
     <li><a href="x">site2</a></li> 
     </ul> 
     <h2>Welcome</h2> 
     <p>Hellow</p> 
     </body> 
</html>

我做錯了什麼？它是在CSS部分或HTML的東西？如果你能提供幫助，我會非常高興。謝謝。

來源

2013-03-26 Kevril

你有border-width:0px;在你的風格.nav這是讓你的邊界不會出現。刪除該行（無論如何您都要在簡寫border定義中設置寬度），它應該可以工作。

使用開發人員工具（如Chrome的「檢查元素」）來幫助您計算出哪種風格會打破它，這些功能很方便。

（IE具有「開發工具」和Firefox也有類似的內置東西，也可以安裝螢火蟲）

來源

2013-03-26 17:07:47 n00dle

我假設你指的是.nav類。如果是這樣，你有：

border:3px solid white; 
    border-width:0px;

確保它有一個寬度，你會看到你設置的顏色。

來源

2013-03-26 17:08:14 DiscoInfiltrator

這是因爲在.nav上已指定border-width:0;。

儘管您在border樣式中指定了3px，但它能夠有效地呈現無邊框的邊框。

取而代之，它的工作原理。

DEMO：http://jsfiddle.net/cVNwn/

來源

2013-03-26 17:08:18 mattytommo

從.nav刪除border-width:0px;，它應該工作

演示：http://jsfiddle.net/zRQdj/

來源

2013-03-26 17:09:43 Eli

導航欄邊框不會改變顏色

回答

相關問題