圖像邊框造型

我正在創建一個應用程序，其中有一張圖像列表。在點擊圖像時，我會在距圖像一定距離處獲得圖像周圍的厚邊框。圖像邊框造型

我需要編輯此邊框並使用CSS縮小圖像和邊框之間的間距。

關於我如何實現這一目標的任何建議？

在此先感謝。

用於此的CSS是：

.logo_set_iphone { 
    display: inline-block; 
    width: 100%; 
    float: center; 
    padding-top: -50px; 
    padding-bottom: -50px; 
    padding-left: -50px; 
    padding-right: -50px; 

} 
.logo_set_iphone img { 
    display: inline-block; 
    text-align: center; 
    height: 50px; 
    float: center; 
    margin-bottom: -6px; 
    margin-top: -6px; 
    margin-left: -5px; 
    margin-right: -5px; 
    padding-top: -10px; 
    padding-bottom: -10px; 
    padding-left: -10px; 
    padding-right: -10px; 
}

所有圖像都放在一個名爲「logoset」裏面的類

來源

2012-02-21 Khush

你可以在[JS小提琴]（http://jsfiddle.net/），或類似的發佈演示？ – 2012-02-21 11:05:53

<html> 
<style type="text/css"> 
.container img{ 
    border:20px solid black; 
} 
</style> 
<script type="text/javascript" > 
function change(){ 
this.style.borderWidth="10px" 
    } 
</script> 
<div class="container"> 
    <img src="http://www.google.co.in/intl/en_ALL/images/logos/images_logo_lg.gif" onclick="change.call(this)" > 
    <img src="http://www.google.co.in/intl/en_ALL/images/logos/images_logo_lg.gif" onclick="change.call(this)" > 
    <img src="http://www.google.co.in/intl/en_ALL/images/logos/images_logo_lg.gif" onclick="change.call(this)" > 
    <img src="http://www.google.co.in/intl/en_ALL/images/logos/images_logo_lg.gif" onclick="change.call(this)" > 
    <img src="http://www.google.co.in/intl/en_ALL/images/logos/images_logo_lg.gif" onclick="change.call(this)" > 
</div> 
</html>

嘗試更新的代碼。從你的評論，我認爲這是你想要什麼.. onclick圖像邊界的變化..

來源

2012-02-21 05:49:52

dint使邊界有所不同，但圖像停止選擇。 – Khush 2012-02-21 06:04:19

@khush你檢查了小提琴嗎？.. – 2012-02-21 06:04:58

@Khush如果你想永久添加圖像的邊框，你可以使用'img：visited {border：15px solid black; }'和'img：active'一起' – 2012-02-21 06:25:40

圖像邊框造型

回答

相關問題