CSS: обернуть изображение вокруг DIV в виде рамки / рамки? - PullRequest
Новая
       33

CSS: обернуть изображение вокруг DIV в виде рамки / рамки?

0 голосов
/ 14 апреля 2011

У меня есть DIV с именем «content», где у меня есть изображение в виде рамки / рамки, которую я хотел бы обойти.У меня обоих есть один большой целый кадр (слева, справа, сверху, снизу), который соответствует ширине, которой он должен быть, а также я разделил его на четыре изображения с одной рамкой (left.png, right.png и т. Д.).).

Но мне очень тяжело пытаться прикрепить их к моему div, чтобы он выглядел правильно.То, что я хотел бы - если это возможно - это прикрепить границу (либо однокадровое изображение, либо четыре расколотых изображения границы) так, чтобы они были сбоку от div.Ширина div составляет 800px, и я хочу оставить его на 800px, а затем прикрепить границы за пределами Div.

Возможно ли это, и если да, то как это сделать?Большое спасибо

Искренне
- Местика

Ответы [ 2 ]

1 голос
/ 14 апреля 2011

Примерно так: http://jsfiddle.net/easwee/Pa6kR/24/

Это будет работать независимо от того, какую ширину вы указали. Вы должны использовать 8 изображений, чтобы заставить это работать (объединитесь в спрайтах). Установите ширину углов, высоту и задний фон на все, что вам нужно.

0 голосов
/ 14 апреля 2011

Вы можете увидеть, что я пробовал:

CSS: 

#content{ 
width:800px;
padding:20px 20px 20px 20px;
margin-bottom: 0px;
margin-top: 30px;
margin-left:160px;
margin-right:auto;
overflow:hidden;
background: #e0e0e0 url("../images/frame.png") no-repeat;

HTML: 

<div id="content"> ALL MY CONTENT INSIDE THIS DIV </div>
...