HTML отображается, как текст
 

HTML отображается, как текст Кодирование HTML позволяет преобразовывать тэги HTML с помощью зарезервированных знаков таким образом, чтобы они отображались, но не исполнялись на веб странице, т.е. HTML будет выглядеть как текст. На странице HTML Encode/Decode онлайн в верхнюю часть окна введите HTML текст, выберите тип операции "Encode", нажмите "Encode/Decode". !!!Ссылки (адреса) не вставлять. Для примера можете ввести этот код: <table background="ФОН" border="0" cellpadding="6" cellspacing="0"><tbody><tr><td style="padding: 6px;" width="700">СОДЕРЖИМОЕ </td></tr></tbody></table> Из нижнего окошка скопируйте выданный код и вставьте в Новую запись. Нажмите Предпросмотр и посмотрите, что получится. Функция "Decode" используется для обратного процесса. На главную

Делаем кнопочки перехода без конструкторов и генераторов...


 

Картинка на кнопке -<a target="_blank" data-cke-saved-href="Адрес страницы" href="Адрес страницы" method="get"><button style="type=&quot;submit&quot;"><table border="5"><img data-cke-saved-src="Адрес картинки" src="Адрес картинки" /></table></button><input type="hidden" data-cke-saved-name="tok" name="tok" value="d378663f8295692217b2c9a3ee4ebe1b" /><input type="hidden" data-cke-saved-name="tok" name="tok" value="aea6ca54eb83078b23ea3e42326f8117" /></a>


Текст и картинка на кнопке -<a target="_blank" data-cke-saved-href="АДРЕС СТРАНИЦЫ" href="АДРЕС СТРАНИЦЫ" method="get"><button type="submit"><img data-cke-saved-src="АДРЕС КАРТИНКИ" src="АДРЕС КАРТИНКИ" align="absMiddle" />НАЗВАНИЕ КНОПКИ</button><input type="hidden" data-cke-saved-name="tok" name="tok" value="d378663f8295692217b2c9a3ee4ebe1b" /><input type="hidden" data-cke-saved-name="tok" name="tok" value="aea6ca54eb83078b23ea3e42326f8117" /></a>



Номера страниц в блоге -<a target="_blank" data-cke-saved-href="адрес страницы блога" href="адрес страницы блога"><b><text size="8"><text color="9d0039">номер страницы</text></text></b></a>

"У Самовара" + Вера Паничкина - это тоже Я


*

Серия сообщений " ШПАРГАЛКИ***** кодов для оформления":

Часть 1 - ССЫЛКА на свой дневник...
Часть 2 - Рамочки в 1 слой...
...
Часть 16 - Закругляем углы на картинках; Вставляем текст на картинку...
Часть 17 - Расположение плеера на открытке.
Часть 18 - Делаем кнопочки перехода без конструкторов и генераторов...
Часть 19 -

Всё про картинки. Часть 1. Закругляем углы.
 

Всё про картинки. Часть 1 Закругляем острые углы на картинке Берём картинку Чтобы закруглить углы на картинке, пишем HTMLкод: <img src="АДРЕС КАРТИНКИ" width="ШИРИНА КАРТИНКИ" height="ВЫСОТА КАРТИНКИ"border="0" style="border-radius: ЧИСЛО ОТ 1 ДО 100%;" /> Вставляем данные и получаем картинку с закругленными углами : Радиус установлен 80% Радиус установлен 9%

Разделяем текст линиями
 

По просьбам читателей, расскажу как делать в тексте такой элемент, как линии. Делается это очень просто и служит она в основном для разделения текста, или картинок. Вот так

Как вставить ПРОКРУТКУ в пост.
 

Если Вы хотите добавить в свой пост много текста.Есть один вариант как это сделать, чтобы пост не занимал много места и его не нужно было убирать под КАТ.
Например как у меня в данном случае.Нужно просто вставить в пост прокрутку.
Чуть ниже можно скопировать код ПОСТА С ПРОКРУТКОЙ,
который Вы потом будете вставлять в свой пост.
В коде где написано. КОД КАРТИНКИ.
Загружаете картинку через Радикал фото.Код берёте под №1.
Меняете только размеры картинки width="480"-ширина
height="290"-высота
Если вставляете через Лиру тогда вам нужна только та часть кода,
что находится внутри кавычек.

Чтобы поменять РАЗМЕР ПРОКРУТКИ находим вот такой тег
...position: width:99%;height: 218px...
Меняем цифры под ВЫСОТУ вашей картинки,только немного меньше.
У меня высота картинки 290,а высоту прокрутки я сделала 218.
Это нужно для того чтобы прокрутка не вылезала за размеры картинки
или не была меньше её.
Идём дальше.Где написано URL ФОН
можно поставить фон.Внутрь одинарных кавычек.
Кавычки обязательно оставить иначе код может не загрузиться.
Так же через радикал фото код под №1.
Или через Лиру так же как мы вставляли код картинки.
А можно этот фон и неставить.
В моём случае я не стала добавлять Фон для текста.
Но бывает один неприятный нюанс-когда вы загружаете фон
он вставляется как ссылка и если в коде (где вы поставили фон)
у вас появилось [URL ...в начале и в конце .../URL]
вот такой значёк,в квадратных скобках его просто нужно убрать из начала и в конце.
Смотрите внимательно,чтобы кавычки не удалить.
И самое основное.
Где написано ВАШ ТЕКСТ.
Пишите свой текст.
Но ПРОКРУТКА начинает появлятся тогда,когда написано много текста.
Вот и всё удачи вам в оформлении.

Код ПОСТ С ПРОКРУТКОЙ.<img data-cke-saved-src="КОД КАРТИНКИ" src="КОД КАРТИНКИ" width="317" height="218" align="left" /><div style="overflow:auto;scrollbar-arrow-color:pink;scrollbar-base-color: #C71585; position: width:99%;height:218px;background-image:url('URL ФОН');top:5px;text-align:left;text-indent:5pt">ВАШ ТЕКСТ</div> SvetlanaT

Основные aтрибуты бегущей строки...


 

*

*Основные aтрибуты: marquee direction="up" scrollamount="2" scrolldelay="180" width="400" height="190" hspace="70"... 1. direction - движение строчки (картинки): влево - direction="left" вправо - direction="right" вверх - direction="up" вниз - direction="down"

2. scrollamount="2" - скорость движения строки. Может изменяться от 1 до, например, 60... Ваш текст здесь скорость=1 скорость движение строчки (картинки) =60 Ваш текст здесь 3. scrolldelay="***" – Этот атрибут задаёт временной интервал в миллисекундах между шагами бегущей строки. 4. width="***" – ширина бегущей строки в пикселях или процентах от ширины экрана. 5. height="***" – высота бегущей строки в пикселях или процентах. Если вы делаете бегущую строку в одну строчку, то можно высоту не указывать, она сама подбирается под размер букв 6. hspace="***" – атрибут задает поле в пикселях справа и слева от бегущей строки. Другие атрибуты (они используются редко): bgcolor="#E9E9D1" – Задаёт фоновый цвет бегущей строки. (Вместо E9E9D1 подставляйте свой цвет). loop="2" – задаёт число проходов бегущей строки. Если указать "2" то два раза текст проедет и больше показываться не будет, только если ещё раз обновить страницу). vspace="70" - атрибут задает отступ в пикселах выше и ниже бегущей строки.

Бегущие строчки...


 

*width="***" - ширина бегущей строки по ширине рамки
1. Текст (картинка) движется справа налево

Текст движется справа налево
КОД -<marquee>ТЕКСТ или АДРЕС КАРТИНКИ</marquee>
2. Текст (картинка) движется слева направо
Текст движется слева направо


КОД -<marquee direction="right" width="650">ТЕКСТ или АДРЕС КАРТИНКИ</marquee>

3. Бегущая строка в серединке рамки
ТЕКСТ или АДРЕС КАРТИНКИ
КОД -<center><marquee width="130" scrollamount="3">ТЕКСТ или АДРЕС КАРТИНКИ</marquee><br /> </center>

4. Бегущие картинки в отделочной рамочке


КОД -<center><table border="1" cellpadding="10" cellspacing="10" width="130px" background="//img-fotki.yandex.ru/get/3505/dkartasheva.33/0_b849_c7c6456d_L.jpg"><tbody><tr><td><marquee width="130" scrollamount="3"><img data-cke-saved-src="//img-fotki.yandex.ru/get/3310/dkartasheva.10/0_7c90_86b9d885_S.jpg" src="//img-fotki.yandex.ru/get/3310/dkartasheva.10/0_7c90_86b9d885_S.jpg" />     <img data-cke-saved-src="//img-fotki.yandex.ru/get/3113/dkartasheva.10/0_7c91_6c182e_S.jpg" src="//img-fotki.yandex.ru/get/3113/dkartasheva.10/0_7c91_6c182e_S.jpg" />     <img data-cke-saved-src="//img-fotki.yandex.ru/get/3209/dkartasheva.10/0_7c92_7746ec06_S.jpg" src="//img-fotki.yandex.ru/get/3209/dkartasheva.10/0_7c92_7746ec06_S.jpg" />     <img

Интересное оформление текста - 3 - ...







 

Я

           Пишу

                 Лесенкой!!!

СПЕЦКОДЫ для оформления поста -1-







 

Коды при оформлении ТЕКСТА (выделение цитаты, эпиграф, расположение текста в столбиках)...- 2 -


 

*1. ШРИФТЫ...

мой самый самый любимый шрифт

<p style="margin: 0px; padding: 0px 0px 15px; line-height: 23px; color: rgb(38, 35, 35); font-family: verdana, &quot;lucida grande&quot;, tahoma, arial, sans-serif; font-size: 14px;">мой самый самый любимый шрифт</p>

*Ещё один, который мне нравится

<em><span style="font-size:14px;"><span style="font-family: comic sans ms,cursive;">Ваш текст</span></span></em>

---

увеличение расстояния между строк

---

*2. ЗАДАТЬ ЦВЕТ, РАЗМЕР и ВИД ШРИФТА
текста

<span style="font-family:шрифт"><font color="Цвет" size="Размер">...Текст...</font></span>

ИЛИ

<span style="font-family:ШРИФТ;color:#ЦВЕТ;font-size:РАЗМЕР px">...Текст...</span>

Размер части текста можно изменить <font size="размер шрифта">...Текст...</font> ИЛИ [size=размер шрифта]...Текст...[/size] где size="1" (2; 3; и т.д.) или задавать как размер от текущего (например -1 или +3 - меньше или больше заданного на 1 или 3 уровня) Формат цвета (#......) — можно получить из графического редактора, или использовать названия цветов — red, green, blue, gray, white, black и т.д.(см. Таблицы Генераторы цвета) [color=цвет]текст[/color] —текст заданного цвета (цвета —blue, red, green и т.д.). Очень удобно, если надо заменить цвет в определённом месте текста.

*3. ОТСТУПЛЕНИЕ НАЧАЛА ТЕКСТА ОТ КРАЯ:

Например,

Справочник по основным тегам HTML.
 

При создании поста хочется не только дать какую то информацию, но и красиво оформить ее, так как это всегда привлекает внимание... Но не все знают как сделать это, да и трудно удержать в голове различные теги и формулы. Поэтому ВСЕ основные коды и подсказки, нужные на ЛиРу для оформления своих постов собраны здесь. Просто подставляйте в эти формулы свои тексты, ссылки, адреса, картинки и прочее. И ваши посты будут красивыми и привлекательными.

СПРАВОЧНИК ПО HTML.

• ТАБЛИЦА БЕЗОПАСНЫХ ЦВЕТОВ ЗДЕСЬ
  

  ---

• ВСЕ ЦВЕТА ИНТЕРНЕТА ЗДЕСЬ
  

  ---

  
  
  ВИД ШРИФТА:
  

Объединяем атрибуты тега font (ВИД ШРИФТА, РАЗМЕР ЦВЕТ) в одном теге:

Шрифт этого текста «Monotype Corsiva»

код этого текста:




Оформление ссылок
Все о ссылках, оформление и коды, полную HTML по ссылкам


Как сделать, чтобы картинка была ссылкой на веб-страницу:


Как вставить ссылку на веб-страницу, чтоб она открылась в новом окне:




Окошечко для вставки кода,
Как правильно вставлять код в окошко для кодов
Выглядит такое окно вот так так:

Код такого окна:


где rows и cols определяют площадь окна, его ширину и высоту










Он-лайн аудио-плееры
Вставить файл mp3 в блог:




Смотрите

Серия сообщений "Шпаргалки":

Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 18 - Как правильно вставлять код в окошко для кодов.
Часть 19 - Рамочки с флагом своей страны.
Часть 20 - Справочник по основным тегам HTML.
Часть 21 - Создание рамочек без знаний html всего за пару минут
Часть 22 - Главные люди на Ли.ру
...
Часть 28 - Вставляем картинки в свои сообщения
Часть 29 - Справочник html по изображениям
Часть 30 - Как сохранить гифку из Одноклассников
 

Справочник html по изображениям
 

В этом посте, постараюсь собрать все коды и теги по КАРТИНКАМ, которые нам нужны для создания постов, рамочек и поздравительных открыток.

---

Код любой картинки в сети в самом простом варианте, без рамочек, украшения и прочего:

<img src="АДРЕС КАРТИНКИ">

В этот код просто подставляем Уникальный адрес (URL) картинки.

Серия сообщений "Шпаргалки":

Часть 1 - Как сделать бегущую строку и бегущее изображение в дневнике
Часть 2 - Несколько оригинальных формул и ссылок для дневника
...
Часть 27 - Проигрывание музыки при открытии поста
Часть 28 - Вставляем картинки в свои сообщения
Часть 29 - Справочник html по изображениям
Часть 30 - Как сохранить гифку из Одноклассников
 

Всё для Вашего дневника (используем прокрутку справа)
 

Оформление, выравнивание, убрать под кат текст в блоге
 

Разделительные линии для текста с настройкой размера и цвета
 

Вставляем музыкальный плеер в определённое место
 

Вставляем музыкальный плеер в определённое место Чтобы вставить плеер (и не только) в определённое место, нужно создать код и вписать туда нужные для этого теги. Код: <div align="center"><table border="0" cellpadding="0" background="ФОНОВАЯ КАРТИНКА"><tbody><tr><td style="padding: 0px;" width="ШИРИНА ФОНА" height="ВЫСОТА ФОНА" ТЕГИ ВЫРАВНИВАНИЯ>КОД ПЛЕЕРА</td></tr></tbody></table></div> Теги выравнивания: снизу по центру — valign="bottom" align="center" снизу справа — valign="bottom" align="right" снизу слева — valign="bottom" align="left" сверху в центре — valign="top" align="center" сверху справа — valign="top" align="right" сверху слева — valign="top" align="left" Примеры: Cверху слева: Cнизу слева: Сверху справа:

Подушка - сердечко
 

Эта подушечка может стать не только украшением дома, но и интересным подарком. Наволочка выполнена в технике «буфы» узором «Плетенка», на потайной молнии. Легко стирается. Причем сшить ее можно из таких тканей, как крепсатин, габардин, флис и подобное. Главное, чтобы ткань не мялась. В качестве наполнителя используется синтепон, либо холлофайбер. А сейчас в моде подушки из полистироловых шариков.

Для работы нам понадобится:

1. 1 м. крепсатина (при ширине 1,5 м.)
2. 1 м. синтепона
3. 1 м. бязи (для основы подушки)
4. Ножницы
5. Нитки
6. Потайная молния
7. Фломастер
8. Линейка
9. Зажимы
10. Булавки с головками
11. 2 листа ватмана формата А2 (для шаблона)
12. Ручной пробойник (или шило)

Роза из салфеток для украшения стола
 

Ничего не нужно, только салфетки, но и подарочный бантик, карандаш для удобства;)))))))Cкромно, но симпатично смотрится;)))))))))

Главное фантазия, идея и стол украшен своими руками! Все легко и просто;))))))))

Прихватки для кухни своими руками
 

Одна из идей прихваток на кухню - это прихватки в виде сердечек. Чтобы сшить прихватки на кухню вам понадобятся материалы:
ткань нескольких оттенков красного цвета;
подкладочная ткань;
1 метр белой зигзагообразной каймы;
0,5 метра белой хлопчатобумажной ленты;
несколько пластиковых колец;
фетр (или синтепон) для прослойки внутри прихватки;
швейные булавки - гвоздики;
швейная машинка;
бумага и карандаш для создания шаблона.

1. Нарисуйте на бумаге шаблон сердца и перенесите на ткань. Вырежьте четыре сердца из ткани основного цвета, а также из подкладочной ткани и фетра (синтепона). Одно из фетровых (синтепоновых) сердец для прослойки внутри прихватки разрежьте пополам.

Диванная подушка в технике "буфы"
 

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

Для изготовления подушки 35*35 см. потребуется:

1. Ткань крепсатин 65 см. (при ширине ткани 150 см.)
2. Ткань бязь 40*80 см.
3. Синтепон или холлофайбер в качестве наполнителя 1 м. (при ширине 150 см.)
4. Молния 35 см
5. Нитки «джинсовые», нитки для швейной машинки (потоньше)
6. Игла с широким ушком
7. Булавки с головками
8. Линейка
9. Ножницы
10. Меловой карандаш для раскроя / кусочек мыла / фломастер самоисчезающий

Выкраиваем основу подушки из бязи, сшиваем с трех сторон, оставив отверстие примерно 10 см. Выворачиваем. Набиваем наполнителем, предварительно разорвав на мелкие кусочки. Можно не разрывать, свернуть в несколько слоев и надеть «наперник», но тогда одну сторону нужно оставить полностью не зашитой. После набивки прострачиваем отверстие (сторону). Необходимо немного распушить уже сшитую основу, руками сгладить неровности.