Возможно ли на Css сделать такую рамку?

vovan · 09.12.2006

Вобщем-то вопрос в теме, как на CSS сделать такую рамку с подписью:

PS: просто я сейчас изучаю css на практике, поэтому вопросов много, а форум у вас классный :biggrin:

LeopART · 10.12.2006

А при чем тут рамка? по мойму тут просто картинка и подпись под ней на белом фоне.
Делается элементарно:
в ячейуе или блоке - это уже о твашего пожелания. margin-top, margin-right, margin-left - одинаковый, margin-bottom - чуть больше.

получится что то такое:

Код:

.pc {margin-top: 5; margin-right: 5; margin-left: 5; margin-bottom: 10;}

<div class=pc bgcolor=white width=150 height=100>
  <img src="yoururl" />
  <br />
  <span class="textstyle">Подпись к картинке</a>
</div>

Ну вот как то так наверное...

vovan · 10.12.2006

LeopART сказал(а):
А при чем тут рамка? по мойму тут просто картинка и подпись под ней на белом фоне.
Делается элементарно:
в ячейуе или блоке - это уже о твашего пожелания. margin-top, margin-right, margin-left - одинаковый, margin-bottom - чуть больше.

получится что то такое:

Код:

.pc {margin-top: 5; margin-right: 5; margin-left: 5; margin-bottom: 10;} <div class=pc bgcolor=white width=150 height=100> <img src="yoururl" /> <br /> <span class="textstyle">Подпись к картинке</a> </div>

Ну вот как то так наверное...

Помоему там как-то сделана именно рамка, а в ней текст, может я ошибаюсь?
Но вопервых там фон белый у страницы, а рамка серая; вовторых на границе серой рамки видна более темная граница.

LeopART · 10.12.2006

Ну так то же самое и получается
Для внешнего дива прописываешь margin и border, задаешь цвет фона.
Внутри него делаешь еще один див, прописываешь для него цвет границы, фон, отступ если надо. внутрь вставляешь текст. И все

DnAp · 11.12.2006

Ну можно задать див вокруг картинки и сказать стилем...

Код:

background-image:url(podpis.jpg);
background-repeat:no-repeat;
background-position:center bottom;

Derik · 12.12.2006

Да и span хватит:

html:
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id=pc width=150 height=300>
<br />
<br />

<br />
<span class="free">Подпись к картинке</span>
</div>
</body>
</html>

css:
#pc {margin:5px 5px 10px 5px; border:1px solid #E0E0E0;}
.free { border: 1px solid #E0E0E0; display:block; background: #E0E0E0; padding: 2px; text-align:center; font-family: sans;}

Возможно ли на Css сделать такую рамку?

vovan

Active Member

LeopART

Well-Known Member

vovan

Active Member

LeopART

Well-Known Member

DnAp

self::setDebugMode(true);

Derik

Well-Known Member

Онлайн статистика

Статистика форума

Новые пользователи

Поделиться этой страницей