如何在html中的多個圖像下放置'buy'和'info'按鈕？

我想在每個圖像下面顯示兩個按鈕'buy'和'image'按鈕。我想用html。

2016-05-16 tani

有什麼不對的，你現在有代碼？它已在每個圖像下顯示兩個按鈕。你想改變什麼？ – gibberish

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<style> 
 
div.img { 
 
    margin: 5px; 
 
    border: 1px solid #ccc; 
 
    float: left; 
 
    width: 180px; 
 
} \t 
 

 
div.img:hover { 
 
    border: 1px solid #777; 
 
} 
 

 
div.img img { 
 
    width: 100%; 
 
    height: auto; 
 
} 
 

 
div.desc { 
 
    padding: 15px; 
 
    text-align: center; 
 
} 
 
</style> 
 
</head> 
 
<body> 
 

 
<div class="img"> 
 
    <a target="_blank" href="img_fjords.jpg"> 
 
    <img src="img_fjords.jpg" alt="Trolltunga Norway" width="300" height="200"> 
 
    </a> 
 
    <div class="desc"><button>Buy</button><button>Image</button></div> 
 
</div> 
 

 
<div class="img"> 
 
    <a target="_blank" href="img_fjords.jpg"> 
 
    <img src="img_fjords.jpg" alt="Trolltunga Norway" width="300" height="200"> 
 
    </a> 
 
    <div class="desc"><button>Buy</button><button>Image</button></div> 
 
</div> 
 

 
<div class="img"> 
 
    <a target="_blank" href="img_fjords.jpg"> 
 
    <img src="img_fjords.jpg" alt="Trolltunga Norway" width="300" height="200"> 
 
    </a> 
 
    <div class="desc"><button>Buy</button><button>Image</button></div> 
 
</div> 
 

 
<div class="img"> 
 
    <a target="_blank" href="img_fjords.jpg"> 
 
    <img src="img_fjords.jpg" alt="Trolltunga Norway" width="300" height="200"> 
 
    </a> 
 
    <div class="desc"><button>Buy</button><button>Image</button></div> 
 
</div> 
 

 
</body> 
 
</html>

來源

2016-05-16 14:58:46 jophab

如何在html中的多個圖像下放置'buy'和'info'按鈕？

回答

相關問題