Очень простое создание рамочек для тем - урок

Рамочки для текста создаются, как известно, двумя способами:

1. При помощи тега table (табличная верстка). При этом способе получаются довольно сложные (по строению и коду) рамочки, могут растягиваться в ширину и длину. Их можно изготовить а Рамочнике. Но он мне абсолютно не понравился - слишком заумный и нагроможденный

2. А вот при помощи этого сайта можно создавать рамочки легко и просто. При этом используется тег div. Рамочку для этой темы я сделала именно там. Очень понравился сайт - не надо заморачиваться с прописыванием тегов и т.д. Огромная благодарность Алексею создателю сайта. Это конечно не скромно, но напишу :) Когда набрела на его сайт он еще не работал для наших блогов, то есть для блогов на mail.ru. Молчать не стала, написала письмо "Всё классно, мэйловцы ждут, делай" )) И вот оно Новогоднее чудо - заходит, создаем, украшаем наши темы :) Кстати доделаю тему и надо не забыть написать ему благодарственное письмо.

Теперь к делу. 
Как же пользоваться сайтом?



1. Идем на сайт li-web.ru/serv/ram/

2. Выставляем ширину будущей рамочки



3. Для того чтобы сделать обводку щелкаем мышкой по нужной границе на схеме рамочки



а затем в меню нажимаем на кнопку



и выставляем толщину, вид и цвет.

Также выбираем параметры для ячейки
выбираем при помощи мышки нужную ячейку на схеме, затем нажимаем на кнопку



определяем ее толщину в пикселях, цвет или фон
вставляем адрес на фоновое изображение
(прямую ссылку на картинку берем на радикале)
в окошко



4. Внутренний слой рамочки обычно содержит текст. Для того чтобы его написать делайте внутренний слой активным, выбирайте цвет ячейки из палитры:



После чего в этой вкладке выбирайте кнопку текст



и в окошке для текста пишите свою запись.
Доступны функции форматирования и выбора цвета текста.



5. Рамочка готова!
Остается выбрать код html для вставки в блог



6. Для того чтобы рамочка находилась в теме по центру перед кодом пишем



а в самом конце всего кода темы



От души и с любовью ваша Юля Линд.
Творческих успехов, Друзья!


P.S. Обратите внимание на метку в этой теме,
если потеряете урок он всегда будет в моих метках в левом верхнем углу блога под аватаром именно под этой меткой рамочки-рисуем

 

Источник: Юлия Линд