кадр с использованием фонового изображения - PullRequest
Новая
       30

кадр с использованием фонового изображения

0 голосов
/ 04 июля 2011

Я вставил рамку в мои изображения.

Я создал CSS для background-image - это изображение рамки, но он должен иметь отступ X для рамки. 

img.frame
{
    background-image:url('http://bit.ly/k8g8zz');
    background-repeat:no-repeat;
    background-position: center;
    background-size: 100%;
    padding:23px 14px 60px;
}

Я не могу использовать div внутри другого, потому что мне нужно, чтобы это изображение представляло собой ссылку с заголовком, а W3C не может быть тегами div внутри.

Если возможно, измените jsFiddle и пришлите мне ссылку

См. Полный код здесь .

Как вы можете видеть в jsFiddle, рамка имеет неправильный размер .. она должна расти вместе с изображением и иметь отступы.

Спасибо всем за помощь.

Ответы [ 2 ]

2 голосов
/ 04 июля 2011

У вас почти есть это! Просто установите оба размера background-size; 

background-size: 100% 100%;

http://jsfiddle.net/vLBXH/

0 голосов
/ 04 июля 2011

Вы не можете установить ширину и высоту для фонового изображения в CSS, AFAIK.Если вы используете изображение фиксированной ширины (PNG), у вас также должны быть изображения соответствующего размера.Другой подход может заключаться в том, чтобы стилизовать фрейм только с помощью CSS или добавить рамку-тег вокруг связанного изображения, которое затем можно будет стилизовать, например: 

<div class="img_frame">
    <a href="#nohref"><imgr src="#noimg" /></a>
</div>
...