-Рубрики

 -Метки

берёт берет биссер браузеры вышивка вязание кайма вязание юбки вязание аксессуары вязание вилка вязание детям вязание для дома крючек вязание для дома спицы вязание кайма вязание круглой кокетки вязание кружево вязание крючек воротники вязание крючек для дома вязание крючек женское вязание крючек узоры вязание крючек уроки вязание мочалки вязание мужчинам вязание обувь крючком вязание рюши вязание следилка вязание следки тапочки вязание собакам вязание соединение мотивов вязание спицами женское вязание спицами узоры вязание спицы вязание сумки вязание сумки крючек вязание теневого рисунка вязание теневой узор вязание узоры для расширения полотна вязание узоры спицами вязание укороченые ряды вязание уроки вязание шляпки вязание шнуров вязание юбки дела домашние друзья жаккард жизнь зверье мое здоровье игрушки интересное ирландское кружево клипарт книги компьютерная грамотность красота и здоровье красота и мода кулинария ли-ру лирика люди мои работы нейросеть мудрость музыка новый год обувь плагины полезности помощь притча программы пряжа работа в нейросети разделители рамочки религия рукоделие скрап набор схема схемы телефон уроки по платкам уроки фотошоп учеба филейка фильмотека фитнес фоны фракталы художники цветоводство шалибактусышарфы шапки шитье юмор

 -Поиск по дневнику

Поиск сообщений в LIKA9966

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 20.03.2010
Записей: 32085
Комментариев: 768
Написано: 47281


Урок по созданию музыкальной открытки

Воскресенье, 21 Февраля 2016 г. 14:48 + в цитатник
Цитата сообщения bloginja Урок по созданию музыкальной открытки





Урок по созданию музыкальной открытки



Как и обещала, сделала урок про музыкальные рамки-открытки.


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

Я взяла для примера такие:

1. Контур

//s017.radikal.ru/i441/1511/0c/7f73ad9c6637.jpg

2. Широкая вставка

//s017.radikal.ru/i426/1511/f8/44810002034f.jpg

3. Фон рамки для плеера

//s019.radikal.ru/i605/1511/3b/890fed9f9405.jpg

4. Фоновая картинка

//s014.radikal.ru/i326/1511/fe/0114e289b005.gif




2. Скелет HTML кода рамки копируем в Новую запись дневника

<div align="center"><table border="0" cellspacing="0" cellpadding="3" background="КОНТУР"><tbody><tr><td style="padding: 3px;"><table border="0" cellspacing="1" cellpadding="15" background="ШИРОКАЯ ВСТАВКА"><tbody><tr><td style="padding: 15px;"><table border="0" cellspacing="0" cellpadding="3" background="КОНТУР"><tbody><tr><td style="padding: 3px;"><table border="0" background="ФОНОВАЯ КАРТИНКА" cellpadding="0" cellspacing="0"><tbody><tr><td style="padding: 0px;" width="240" height="320" align="center"><table border="0"><tbody><tr><td style="padding: 0px;" align="center" width="240" height="320"></td></tr></tbody></table><table border="0" cellspacing="0" cellpadding="2" background="КОНТУР"><tbody><tr><td style="padding: 2px;"><table border="0" cellspacing="0" cellpadding="2" background="ФОН РАМКИ ДЛЯ ПЛЕЕРА"><tbody><tr><td style="padding: 6px;" width="240"><div align="center">ПЛЕЕР</div></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></div>

3. Копируем по очереди ссылки подготовленных картинок и вставляем в код вместо моих слов.
Т.е. копируем ссылку первой картинки и вставляем вместо слова "КОНТУР". Затем копируем вторую ссылку и вставляем вместо слов "ШИРОКАЯ ВСТАВКА". И так со всеми картинками.


4. Размер фоновой картинки указываем в тегах width (ширина) и height (высота). Здесь картинка 240х320, поэтому в коде указаны значения width="240" height="320".
Ещё указываем ширину (width) фона под плеер. Здесь указана ширина width="240" (по ширине картинки).

5. На место слов "ПЛЕЕР" вставляется любой подходящий плеер.
Я вставила такой, только белый:



HTML код такого плеера

Скопируем код из окошка, вставим в код рамки и вместо моих слов "ССЫЛКА НА МУЗЫКУ С РАСШИРЕНИЕМ MP3" вставим ссылку на музыку, к примеру такую http://download-sounds.ru/wp-content/uploads3/2012/11/virus-novyigod.mp3

Сменив в коде classic на negative получим черный плеер.
Сменив auto=no на auto=yes получим плеер с автостартом, но с выключением.


6. И получаем готовую музыкальную открытку.






Вариаций создания подобных рамок много: можно делать совсем без контуров и фонов или наоборот добавить ещё фонов... Главное понять принцип построения рамок с помощью HTML тегов.

А можно сделать вот такую открытку http://www.liveinternet.ru/users/win-win-win/post346502774/

Давно не писала уроки, поэтому может что упустила. Что не понятно, пишите, объясню.

Удачи!

bloginja



Серия сообщений "рамки":

Часть 1 - Рамка для молитвы
Часть 2 - Рамка к Пасхе. Грядущие праздники.
...
Часть 5 - Детская рамочка. Мирилка.
Часть 6 - Музыкальные рамки - открытки
Часть 7 - Урок по созданию музыкальной открытки




Серия сообщений "Памятка для Лиру":

Часть 1 - Бегущая строка из картинок или текста
Часть 2 - Плееры в дневник
...
Часть 10 - Всё про картинки. Часть 4. Картинки в ряд и столбик.
Часть 11 - Программа для скачивания музыки с Лиру
Часть 12 - Урок по созданию музыкальной открытки


Метки:  

 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку