Создание рамки

Среда, 18 Декабря 2013 г. 15:31 + в цитатник

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

Это пример того,что у нас с вами должно получиться в конечном итоге.

Скажи, откуда у тебя
Фантазия такая -
Как будто я люблю тебя
И по тебе страдаю.

Во-первых, милая моя,
Страданий я не знаю,
А, во-вторых, быть может, я
Не по тебе страдаю.

А то, что под твоим окном
Стою я каждый вечер,
Отнюдь не говорит о том,
Что я желаю встречи.

Во-первых, если я там был,
То как простой прохожий,
А, во-вторых, не я там был,
А на меня похожий.

Так вот что, милая моя,
Ты не играй на нервах,
Во-первых, я люблю тебя,
А, во-вторых - во-первых.

РАМОЧКА-РЕЗУЛЬТАТ УРОКА

Давайте рассмотрим подробнее,что нам необходимо сделать,чтобы получить такую рамочку:

1.ПОДГОТОВИТЬ НЕОБХОДИМЫЕ ФОНЫ.
2.ВЫБРАТЬ ПРАВИЛЬНЫЙ КОД ФОНОВ ДЛЯ ВСТАВКИ В КОД-ШАБЛОН РАМОЧКИ.

Вот фоны и коды к ним,которыя я использовала для этого урока:

Ссылка на основной-нижний фон (в коде-шаблоне обозначается,как фон №1) рамочки (Радикал,строчка №1).

Ссылка на второй фон (в коде-шаблоне обозначается,
как фон №2) рамочки (Радикал,строчка №1).

Ссылка на фон (в коде-шаблоне обозначается,как фон №3) записи
(Радикал,строчка №1).

картинка в текст (Радикал,строчка №6).

линеечка-разделитель для текста (Радикал,строчка №6)

Волшебный КОД-ШАБЛОН,для создания рамочки:
<table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №1"><tr valign="top"><td width="100%"><table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №2"><tr valign="top"><td width="100%"><table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №3"> <tr valign="top"> <td width="100%"><center><font face="Times New Roman"><font color="EEDD82"><font size="4">ВАША КАРТИНКА;ВАШ ТЕКСТ </font></font></font>ВАША ПОДПИСЬ</center></td></tr></table></td></tr></table></td></tr></table>

НАШИ ДАЛЬНЕЙШИЕ ДЕЙСТВИЯ:
Копируем (из белого окошка)КОД-ШАБЛОН и вставляем его в текстовое поле вашей новой записи,в формате HTML.
Вот,что у нас получится:
<table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №1"><tr valign="top"><td width="100%"><table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №2"><tr valign="top"><td width="100%"><table width="100%" border="0" cellspacing="1" cellpadding="1" background="ФОН №3"> <tr valign="top"> <td width="100%"><center><font face="Times New Roman"><font color="EEDD82"><font size="4">ВАША КАРТИНКА;ВАШ ТЕКСТ </font></font></font>ВАША ПОДПИСЬ</center></td></tr></table></td></tr></table></td></tr></table>
Сейчас рассмотрим основные параметры тэгов,составляющие КОД-ШАБЛОН рамочки,их значения и названия,без которых невозможно сделать рамку:
1.table width="100%"-этот тэг обозначает ШИРИНУ всей нашей рамочки.В КОДЕ-ШАБЛОНЕ стоит ширина 100%.Значение ширины можно менять на ваше усмотрение.
Вот так выглядет рамочка после добавления фонов и без наших изменений:

ВАША КАРТИНКА;ВАШ ТЕКСТ ВАША ПОДПИСЬ

2. border="0"-этот тэг определяет ТОЛЩИНУ границ каждого слоя рамки (КРАЙ ФОНА).В КОДЕ-ШАБЛОНЕ стоит цифра"0"(см.в коде).Этот тег можно менять на любую цифру по вашему желанию.Например я поменяла в фоне №1 border="0" на border="5" ,в фоне №2 border="0" на border="2" ,в фоне №3 border="0"на border="2"
и вот что у меня получилось:

ВАША КАРТИНКА;ВАШ ТЕКСТ ВАША ПОДПИСЬ
Видите,как изменилась рамка!В первом слое край стал намного шире,чем во втором и в третьем.

3.cellspacing-увеличивает ШИРИНУ фонового слоя,
а cellpadding -расстояние между фонами рамки.
В КОДЕ-ШАБЛОНЕ-параметры выглядят так:
cellspacing="1", cellpadding="1".
Давайте посмотрим,что будет если я их поменяю:
в фоне №1:cellspacing="1" на cellspacing="20",
cellpadding"1" на cellpadding"2",
в фоне №2:cellspacing="1"-оставлю без изменений,cellpadding"1" на cellpadding"5",
в фоне №3:cellspacing="1" на cellspacing="3",
cellpadding"1"-оставлю без изменений.
Вот что получится:

ВАША КАРТИНКА;ВАШ ТЕКСТ ВАША ПОДПИСЬ
Видите разницу? Рамка стала выглядеть совсем по другому !
Далее,чтобы в рамочке всё встало на свои места,делаем отступ вниз после слов ВАША КАРТИНКА;и после слов ВАШ ТЕКСТ.
Вот,что у нас получится:

ВАША КАРТИНКА;

ВАШ ТЕКСТ

ВАША ПОДПИСЬ

Остаётся добавить картинку и текст,результат вы видели.

font color="EEDD822"- ЭТО ЦВЕТ ТЕКСТА.
Имеет цифровое значения "EEDD822".
Можно менять.

font size="4"-ЭТО РАЗМЕР ТЕКСТА.Можно менять значения,
увеличивать или уменьшать текст.

font face="Times New Roman"- ЭТО название ШРИФТА ТЕКСТА.
Можно менять названия.
Вот и всё ! Желаю всем удачи !

Рубрики:

Рамки

<a href="https://www.liveinternet.ru/users/5138442/post303985067/">РЎРѕР·РґР°РЅРёРµ СЂР°РјРєРё</a><br/>РњС‹ СЃ РІР°РјРё СѓР¶Рµ РґРµР»Р°Р»Рё СЂР°РјРѕС‡РєСѓ РЅРµ РїРѕРєРёРґР°СЏ Р±Р»РѕРі,СЃРѕСЃС‚РѕСЏС‰СѓСЋ РёР· РґРІСѓС… С„РѕРЅРѕРІ.РЎРµРіРѕРґРЅСЏ,СЏ СЂР°СЃСЃРєР°Р¶Сѓ РєР°Рє СЃРґРµР»Р°С‚СЊ Р±РѕР»РµРµ СѓСЃР»РѕР¶РЅС‘РЅРЅС‹Р№ РІР°СЂРёР°РЅС‚ СЂР°РјРѕС‡РєРё,СЃРѕСЃС‚РѕСЏС‰РёР№ РёР· С‚СЂС‘С… СЃР»РѕС‘РІ С„РѕРЅРѕРІ ,РІСЃС‘ С‚Р°Рє-Р¶Рµ РЅРµ РїРѕРєРёРґР°СЏ Р±Р»РѕРі.РС‚Рѕ РїСЂРёРјРµСЂ С‚РѕРіРѕ,С‡С‚Рѕ Сѓ РЅР°СЃ СЃ РІР°РјРё РґРѕР»Р¶РЅРѕ РїРѕР»СѓС‡РёС‚СЊСЃСЏ РІ РєРѕРЅРµС‡РЅРѕРј РёС‚РѕРіРµ.  РЎРєР°Р¶Рё, РѕС‚РєСѓРґР° Сѓ С‚РµР±СЏ Р¤Р°РЅС‚Р°Р·РёСЏ С‚Р°РєР°СЏ - РљР°Рє Р±СѓРґС‚Рѕ СЏ Р»СЋР±Р»СЋ С‚РµР±СЏ Р РїРѕ С‚РµР±Рµ СЃС‚СЂР°РґР°СЋ.Р’Рѕ-РїРµСЂРІС‹С…, РјРёР»Р°СЏ РјРѕСЏ, РЎС‚СЂР°РґР°РЅРёР№ СЏ РЅРµ Р·РЅР°СЋ, Рђ, РІРѕ-РІС‚РѕСЂС‹С…, Р±С‹С‚СЊ РјРѕР¶РµС‚, СЏ РќРµ РїРѕ С‚РµР±Рµ СЃС‚СЂР°РґР°СЋ.  Рђ С‚Рѕ, С‡С‚Рѕ РїРѕРґ С‚РІРѕРёРј РѕРєРЅРѕРј РЎС‚РѕСЋ СЏ РєР°Р¶РґС‹Р№ РІРµС‡РµСЂ, РћС‚РЅСЋРґСЊ РЅРµ РіРѕРІРѕСЂРёС‚ Рѕ С‚РѕРј, Р§С‚Рѕ СЏ Р¶РµР»Р°СЋ РІСЃС‚СЂРµС‡Рё.  Р’Рѕ-РїРµСЂРІС‹С…, РµСЃР»Рё СЏ С‚Р°Рј Р±С‹Р», РўРѕ РєР°Рє РїСЂРѕСЃС‚РѕР№ РїСЂРѕС…РѕР¶РёР№, Рђ, РІРѕ-РІС‚РѕСЂС‹С…, РЅРµ СЏ С‚Р°... <a href="https://www.liveinternet.ru/users/5138442/post303985067/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>

Наталья_на_Лиру обратиться по имени БУДЕМ ОРИЕНТИРОВАТЬСЯ ЗДЕСЬ Среда, 18 Декабря 2013 г. 15:34 (ссылка)

ПРИВЕТ ЛИЗОНЬКА

Ответить С цитатой В цитатник

Среда, 18 Декабря 2013 г. 15:40ссылка

Лиза_Головина

Привет, Натуся, будем здесь общаться, переношу сюда интересные записи. Наверху здесь есть "Написать", я копирую из блога запись и вставляю сюда. В заголовке что-нибудь писать и потом в большом окошке код записи из блога и нажимаем "Опубликовать".

Ответить С цитатой В цитатник Обратиться по имени

Комментировать

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]

LiveInternetLiveInternet

-Рубрики

-Музыка

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

-Подписка по e-mail

-Постоянные читатели

-Сообщества

-Статистика

Создание рамки