Question

我正在创建一个应用程序，其中有一个图像列表。单击图像后，我会在距离图像一定距离的图像周围出现粗边框。

我需要编辑此边框并使用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”

的类中

Answer 1

<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图像边框的变化..

图像边框样式

1 个答案: