爲什麼我的<a>元素不顯示？

我正在建造一個導航欄，並且我昨天都做了一切工作。我的電腦昨晚失去了電力，而且我顯然沒有來自昨天的代碼。不管怎麼說，我的CSS是：爲什麼我的<a>元素不顯示？

ul { 
    float: right; 
    background-color: black; 
    width: 600px; 
} 

a { 

    display: inline-block; 
    color: white; 
    text-decoration: none; 

} 

a:link { 
    text-decoration-color: none; 
} 

a:hover { 
background-color: blue; 
} 

li { 
    float: left; 
    color: white; 
    list-style: none; 
    display: inline; 
    padding: 20px 40px 20px 40px; 
} 

body { 
    background-color: #f0f0f5; 
}

和HTML是：

<!DOCTYPE html> 
<head> 
    <title>Practice Site</title> 
    <link href=main.css rel=text/css type=stylesheet/> 
</head> 

<body> 
    <ul> 
     <li><a href=#></a>Home</li> 
     <li><a href=#></a>Home</li> 
     <li><a href=#></a>Home</li> 
     <li><a href=#></a>Home</li> 
    </ul> 
    <!--Sign up form--> 
    <form> 
     <p>First Name</p> 
     <input type="text" name="First Name" size="20" maxlength="30" /> 
    </form> 
</body>

另外，我不太明白，我怎麼能縮進所有的代碼，我有沒有我的問題顯示使用控制+ v複製所需的縮進。我已經閱讀了高級幫助，並沒有看到如何在那裏做到這一點。

來源

2016-12-12 Christian Antfeld

「我怎麼能縮進所有的代碼，我在我的問題上顯示」 - http://i.imgur.com/rLwdiHZ .png – Quentin

您的<a>元素沒有內容。移動<a>元素內的文本，您將看到鏈接。

變化

<li><a href=#></a>Home</li>

到

<li><a href=#>Home</a></li>

來源

2016-12-12 17:06:51 Asaph

謝謝！這是我昨天在今天下午沒有提到的變化之一。 –

非常感謝。 –

不客氣。如果此答案解決了您的問題，請通過單擊答案左側的複選標記將其標記爲正確。謝謝！ – Asaph

因爲他們有：

沒有內容將給他們的高度/寬度
沒有將給出CSS他們儘管沒有內容，高度/寬度

把文字內的鏈接，而不是之後。

來源

2016-12-12 17:07:15 Quentin

看到這個代碼：

ul { 
 
    float: right; 
 
    background-color: black; 
 
    width: 600px; 
 
} 
 

 
a { 
 

 
    display: inline-block; 
 
    color: white; 
 
    text-decoration: none; 
 
padding: 20px 40px 20px 40px; 
 
} 
 

 
a:link { 
 
    text-decoration-color: none; 
 
} 
 

 
a:hover { 
 
background-color: blue; 
 
} 
 

 
li { 
 
    float: left; 
 
    color: white; 
 
    list-style: none; 
 
    display: inline; 
 
} 
 

 
body { 
 
    background-color: #f0f0f5; 
 
}

<ul> 
 
    <li><a href=#>Home</a></li> 
 
    <li><a href=#>Home</a></li> 
 
    <li><a href=#>Home</a></li> 
 
    <li><a href=#>Home</a></li> 
 
</ul> 
 
<!--Sign up form--> 
 
<form> 
 
<p>First Name</p> 
 
<input type="text" name="First Name" size="20" maxlength="30" /> 
 
</form>

來源

2016-12-12 17:21:02 Vishnu

如果你解釋瞭如何解決它，這個答案會更有用 – happymacarts

只是將填充應用於「a」而不是「li」 – Vishnu

爲什麼我的<a>元素不顯示？

回答

相關問題