CSS - HTML如何使錨圖像去一個特定地點

Question

我想都在不同的角落，例如，左上，右上，右下，右下錨圖像，並在中心之一謝謝

如何讓我所有的錨鏈接/圖片轉到特定的一面我希望左上角的球隊我希望存儲右上角贊助商左下角和關於我們右下角我認爲我做了所有正確的代碼，噸如何起來的特定點

如果有人可以幫助將是非常讚賞

碼

http://pastebin.com/Yjth4U93

JSFIDDLE

的CSS

.section-links { position: relative; height: 500px; background-color: #c3c3c3 ; } 
.section-links a { position: absolute; } 
.section-links a.top-left { top: 10px; left: 10px; } 
.section-links a.top-right { top: 10px; right: 10px; } 
.section-links a.bottom-left { bottom: 10px; left: 10px; } 
.section-links a.bottom-right { bottom: 10px; right: 10px; } 

的Html

<div class="section-links"> 
    <a href="teams.html" class="top-left"> 
    <img style="width: 100px;" src="icon1.jpg" alt=""> 
    </a> 
    <a href="teams.html" class="top-right"> 
    <img style="width: 100px;" src="icon2.jpg" alt=""> 
    </a> 
    <a href="teams.html" class="bottom-left"> 
    <img style="width: 100px;" src="icon4.jpg" alt=""> 
    </a> 
    <a href="teams.html" class="bottom-right"> 
    <img style="width: 100px;" src="icon3.jpg" alt=""> 
    </a> 
</div> 

預先感謝您。

Answer 1

HTML

<link rel="stylesheet" href="main.css" media="screen" title="no title" charset="utf-8"> 

CSS

.section-links { 
    position: relative; 
    height: 500px; 
    background-color: #c3c3c3 ; 
} 

.top-left { 
    top: 10px; left: 10px; 
    position: absolute; 
} 

.top-right { 
    position: absolute; 
    top: 10px; right: 10px; 
} 
.bottom-left { 
position: absolute; 
bottom: 10px; left: 10px; 
} 
.bottom-right { 
    position: absolute; 
    bottom: 10px; right: 10px; 
}