Рамка внутри блока или картинки при наведении

Чтобы рамка появлялась внутри блока или картинки можно использовать свойство outline-offset. С помощью него можно задать расстояние от края элемента до рамки. Отрицательное значение отображает рамку внутри элемента, положительное — вокруг элемента.

Пример

HTML


<img src="image.jpg" alt="" title=""/>

CSS


img:hover {
    outline: 2px dashed #3d1f15; /* Ширина, вид и цвет рамки */
    outline-offset: -10px; /* Выводим рамку внутри элемента */
}