Динамическая кайма


0
Доброго времени суток, lifehacker!

Расскажу о способе создания динамически масштабируемой рисованной каймы для элементов страницы.
Основным элементом является простая рамочка-рисунок аля:



Эта рамочка натягивается сверху и снизу с помощью классов стилей:

 <style>
.field{
position:relative;
width: 245px; color:#000;
font: lighter 11px Verdana;
text-decoration:none;text-align:left;}
 
.top{
    text-align: center;
    padding: 10px 10px 0;
.b {padding: 7px;
</style>

Далее все это разметить нужно всего лишь разметить =)

<div class="field" id="box_1"><div class="top">
Some weird words
</div><div class="b"></div></div>

<br />
<br />

<div class="field" id="box_2"><div class="top">
<img class="tooltipTNS" src="http://cdn.tns-global.com/multimedia/Ru/C47-09_Multon/2.jpg" />
<br />
Fine juice with description
</div><div class="b"></div></div>

Наглядный примерчик


девушки,если вы маленькие ростом,у вас маленькие сиськи и некрасивое лицо-рубите лес,мстите природе
Опубликовано mustordont в пн, 21/09/2009 - 21:02.

жжош))))))
Опубликовано captain в вт, 22/09/2009 - 07:17.

Извините, но правильно писать КАЙМА. Через А.
Опубликовано Неизвестный (не проверено) в вт, 22/09/2009 - 09:04.

Вова исправь... грамотей блять, мне тоже глаз порезало дико)
Опубликовано captain в вт, 22/09/2009 - 10:01.

Отправить комментарий

  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Допускаются только следующие теги HTML: <a> <p> <span> <div> <h1> <h2> <h3> <h4> <h5> <h6> <img> <map> <area> <hr> <br> <br /> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <em> <b> <u> <i> <strong> <del> <ins> <sub> <sup> <quote> <blockquote> <pre> <address> <code> <cite> <embed> <object> <strike> <caption>

Подробнее о форматировании

привет

Чтобы этот блок исчез, необходимо зарегистрироваться или авторизоваться.

Регистрация веб-мастера на ресурсе включает ввод адреса и названия своего главного проекта, а также адресов других своих проектов по желанию.

Именно главные ресурсы каждого зарегистрированного пользователя появится в топе, который находится ниже.

Хорошо оцененные статьи зарабатывают больше очков для автора и двигают его самый главный проект ближе к первому месту.

Главные проекты 10-ти самых лучших писателей ресурса всегда на виду у посетителя!

топ проектов

1 Lifehack 2.0: Live! 48
2 Вместо работы 44
3 БлогДилер 41
4 Webfairy 30
5 Proofsite 25
6 chesenka.ru 17
7 abakanchik 11
8 Блог Vorahaz 9
9 TNS 8
10 Ищите Плюсы 5

вход