点击它们时图像正在缩小

时间:2017-01-26 14:34:07

标签: html css image

我有一个简单的图像,我在点击时将css边框3px添加到图像,但问题是当我点击活动类没问题但图像缩小了一点,它看起来像尺寸ID不同,

看起来图像缩小了一点但宽度和高度相同

即使在活动模式下使用3px边框,我也希望将图像保持原样

import urllib
from django.shortcuts import redirect

def redirect_params(url, params=None):
    response = redirect(url)
    if params:
        query_string = urllib.urlencode(params)
        response['Location'] += '?' + query_string
    return response

def your_view(request):
    your_params = {
        'item': 4
    }
    return redirect_params('search_view', your_params)
   li img {
      cursor: pointer;
      border-radius: 4px;
      box-shadow: 0 3px 10px rgba(0,0,0,0.3);
    }
    
     li .active img {
        border: 3px solid #01b9d1;
        border-radius: 6px;
        cursor: default;
    }
    .overview {
      width: 140px;
      height: 77px;
    }

2 个答案:

答案 0 :(得分:0)

使用大纲样式的CSS属性代替边框。
http://www.w3schools.com/css/css_outline.asp

答案 1 :(得分:0)

在img元素上添加GCVector(dx: 1.0 * dx, dy: 1.0 * dy)。使用box-sizing: border-box使宽度和高度属性(以及最小/最大属性)包括内容,填充和边框,请检查source

e.g。

border-box

请参阅fiddle