使CSS圖像成爲鏈接

Question

我只是在一個網站上工作，我需要一個圖像在右上角，點擊鏈接到另一個網站。

div.image:before { 
content:url(http://LinkToMyImage); 
max-height: 169px; 
max-width: 220px; 
position: absolute; 
top: 0px; 
right: 0px; 
} 

然後加入這個網站：我在CSS文件中創建了這個

<div class="image"></div> 

這似乎正是我想要的，但它顯然不是一個鏈接，是有辦法，我可以讓這個聯？我已經嘗試過對div的href，但不起作用。任何幫助是極大的讚賞！謝謝！

Answer 1

您可以通過簡單地使用錨標籤來完成完全相同的操作。另外，通過引用你的類適用的元素，不需要對你的css有特殊的要求。這將需要比使用類名更長的時間。

如果您需要更高級別的特異性，請將您的元素與另一個類名相關聯。如果未來需要更改標記，避免使用特定元素可使代碼更加靈活。

更改您的HTML：

<a class="image"></a> 

和你的CSS來：

.image:before { 
    content:url('http://LinkToMyImage'); 
    // You should also be able to safely eliminate `display: block;` 
    // when setting `position: absolute`, but included it just in case you 
    // experienced problems setting width and height 
    display: block; 
    height: 169px; 
    width: 220px; 
    position: absolute; 
    // top 0 is usually inferred when setting position: absolute; 
    // you should be able to remove this 
    top: 0px; 
    right: 0px; 
}