как сделать картинку с окошком для кода? Например, мы хотим сделать картинку (баннер) с окошком, в котором будет размещен код картинки. Вот так:
Я постараюсь объяснить как это сделать.
Для начала нам нужно загрузить картинку на какой-нибудь хостинг картинок. я, например использую для этого pics.kz
(но также можно использовать и яндекс, и другие )
Фотохостинги:
gallery.ru imagebam.com imgur.com imageshack.us tinypic.com foto.radikal.ru photobucket.com)
мы загружаем картинку и получаем ее коды.
Выбираем первый код, который стоит после "HTML-код (Сайты, блоги )"
Например, у меня такой код:
<a href="http://pics.kz/" title="(28 Kb, 200x75)"><img src="http://pics.kz/s5/af/d9/5b/afd95be31ec2fa822c386ccb1ecb1ac2.png" border="0" alt="(28 Kb, 200x75)" title="(28 Kb, 200x75)" /></a>
Напоминание : (Выбор типа текстового редактора – простой , для работы со спец.кодами и ручным вводом HTML тегов, и расширенный редактор , в котором пользователю предлагается интерфейс продвинутого текстового редактора.) Нам понадобиться работа с HTML-кодами.
Теперь в title=". ......... Lady_Alika , то я вставлю ее ник. это будет выглядеть так: title="Lady Alika"
В тэг href="........... " вставляем ссылку, на страницу. Например, если вы хотите, чтобы при нажатии на картинку, люди попадали на определенную страницу. В моем случае для баннера Lady Alika, я вставлю ссылку на ее страницу. Это будет так: href="http://www.liveinternet.ru/users/lady_alika/profile/"
К слову сказать, border="0" тоже можно менять, тогда ваша картинка будет обведена линией толщину которой вы и устанавливаете.
Далее у нас получился такой вот код картинки
<a href="http://www.liveinternet.ru/users/lady_alika/profile/" title="Lady Alika"><img src="http://pics.kz/s5/af/d9/5b/afd95be31ec2fa822c386ccb1ecb1ac2.png" border="0" alt="(28 Kb, 200x75)" title="(Lady Alika)" /></a>
Чтобы, получить окно с кодом, нам подобиться такой код как: <textarea>ВАШ КОД</textarea>
вместо "ваш код" вставляем код картинки. Таким образом, нам нужно получить следующее: код картинки <textarea> код картинки </textarea>
Вот, например, у меня получился такой окончательный код картинки с кодом:
<a href="http://www.liveinternet.ru/users/lady_alika/profile/" title="Lady Alika"><img src="http://pics.kz/s5/af/d9/5b/afd95be31ec2fa822c386ccb1ecb1ac2.png" border="0" alt="(28 Kb, 200x75)" title="(Lady Alika)" /></a><textarea><a href="http://www.liveinternet.ru/users/lady_alika/profile/" title="Lady Alika"><img src="http://pics.kz/s5/af/d9/5b/afd95be31ec2fa822c386ccb1ecb1ac2.png" border="0" alt="(28 Kb, 200x75)" title="(Lady Alika)" /></a></textarea>
Вот такой вот небольшой урок. Надеюсь, что доступный и понятный. Заодно я таким вот образом представила пополнение в моих рекомендациях. Думаю, что вы уже поняли.
Надеюсь, что вам поможет этот пост.)
