0
我很久沒有涉足html或css，所以請溫和。圖像href不工作（CSS和HTML）
我想創建一個鏈接到一個網站的按鈕，我似乎無法得到它的工作。我猜這可能是我如何嵌套它，但我不太確定。我已經花了大約半天的時間來搜索潛在的問題，我已經盡力了，所以我正在向社區尋求幫助。
編輯： 我已經縮小了HTML的問題區域，所以它不會混淆每個人。我已經嘗試了4種不同的方式來創建鏈接，我無法點擊其中的任何一個（它們不表現爲鏈接，所以我無法調試它們）。
HEAD/CSS：
<head>
<style>
body {
font-family: Arial, sans-serif;
font-size:12px;
display:block;
margin:0;
Padding:0;
background-color:lightslategrey;
}
a {
color:white;
text-decoration:none;
}
/* div {
display: block;
}
span {
display: inline-block;
vertical-align: middle;
line-height: normal;
} */
ul {
margin:0px;
padding:0px;
}
.toolbar {
position: fixed;
display: inline-block;
top: 0px;
left: 0px;
width: 100%;
/*height:36px;*/
background-color: black;
color: white;
font-size: 100%;
text-align: left;
padding: 5px;
z-index:100;
}
.menu-btn {
position: relative;
display: inline-block;
height: 100%;
left: 50px;
right: 20px;
/*background-color: cyan;*/
}
.menu-btn img {
display:inline-block;
vertical-align:middle;
}
.bannerpic {
position:relative;
display:inline-block;
position: relative;
top:25px;
margin:0;
padding:0;
vertical-align: middle;
background-color: grey;
background-image:url("banner.jpg");
background-position:center;
background-size: cover;
background-repeat: no-repeat;
width:100%;
height:450px;
box-shadow: 0 0 65px #000000;
z-index:-1;
}
.bannercontainer {
position: absolute;
margin:auto;
left:0;
right:0;
bottom:0;
/*padding:5px;*/
display: block;
top:0px;
/*background-color: orange;*/
background-color: black;
background: rgb(0,0,0);
background: rgba(0,0,0,0.4);
width: 900px;
height: 350px;
vertical-align: middle;
}
.bannertextbox {
position: absolute;
display: block;
margin: auto;
left:0;
right:0;
top: 0;
bottom: 0;
padding: 40px;
width:80%;
color: white;
text-align: center;
vertical-align: middle;
/*background-color: pink;
text-shadow: 2px 2px 8px #000000;*/
}
.bannertitle {
position: relative;
display: block;
/*background-color:aqua;*/
padding:10px;
font-size: 400%;
/*bottom:0;*/
}
.bannersubtitle {
position: relative;
display: block;
padding:10px;
font-size: 150%;
/*text-transform: uppercase;
bottom:0;*/
/*background-color:blue;*/
}
.qt {
position: relative;
display: block;
padding:1px;
/*background-color:purple;*/
}
.qt-btn {
display: inline-block;
padding: 15px;
/*background-color:red;*/
}
.qt-btn-txt {
padding-top: 10px;
font-size:90%;
/*background-color:green;*/
}
.content {
position: relative;
margin:auto;
padding:auto;
width:1200px;
height:2000px;
color: black;
font-size: 100%;
background-color:white;
text-align:left;
}
.mytext {
padding:20px;
text-align:justify;
}
ul#nav li{
display:inline;
/*font-color:red;*/
padding:10px;
}
ul#tasks li{
display:inline;
/*font-color:red;*/
}
</style>
BODY/HTML：
<body>
<div class="bannerpic">
<div class="bannercontainer">
<div class="bannertextbox">
<div class="bannertitle">
This is the Main Banner
</div>
<div class="bannersubtitle">
QT Links
</div>
<div class="qt">
<ul id="tasks">
<li>
<div class="qt-btn">
<a href="http://stackoverflow.com/">
<img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-folder-128.png" alt="img1" style="width:72px;height:72px;">
</a>
<div class="qt-btn-txt">
QT1
</div>
</div>
</li>
<li>
<div class="qt-btn">
<img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-folder-128.png" alt="img2" style="width:72px;height:72px;">
<div class="qt-btn-txt">
<a href="http://stackoverflow.com/">
QT2
</a>
</div>
</div>
</li>
<li>
<div class="qt-btn">
<a href="http://stackoverflow.com/">
<img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-folder-128.png" alt="img3" style="width:72px;height:72px;">
<div class="qt-btn-txt">
QT2
</div>
</a>
</div>
</li>
<li>
<a href="http://stackoverflow.com/">
<div class="qt-btn">
<img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-folder-128.png" alt="img4" style="width:72px;height:72px;">
<div class="qt-btn-txt">
QT2
</div>
</div>
</a>
<li>
</ul>
</div>
</div>
</div>
</div>
<div class="content">
<div class="mytext">
This is some text.
</div>
</div>
我的評論我有問題，與地方。我對導航中的鏈接沒有任何問題，只是橫幅。
任何幫助或建議將不勝感激。
在此先感謝！
檢查控制檯是否有錯誤？特別是'404 Not Found'？ – Simplicity
是否所有的圖像都與HTML文檔位於同一目錄中？ – Sam
如果你的圖片沒有錯誤或者404錯誤，你嘗試過在你的'href'上使用'https'而不是'http'嗎？ – AGE