Всегда под рукой. Шпаргалка для оформления постов

Среда, 14 Февраля 2018 г. 19:11 + в цитатник

Цитата сообщения Mariea

Прочитать целиком В свой цитатник или сообщество!

*Mariea@mmg*

Все, что так необходимо для работы на сайте.

HTML ШПАРГАЛКА

CKEditor - онлайн редактор XTML

myBlaze
Уроки HTML. Создаем свой первый сайт

Палитры

http://mudcu.be/sphere/

http://colors.multomelis.com/color/4a2075

http://www.colorhexa.com/

http://www.colorpicker.com/bfb8b8

Таблица цветов с кодами XTML и RGB:
http://www.stm.dp.ua/web-design/color-html.php

ЯПфайлы 3726295_ar37 (53x63, 1Kb) https://www.yapfiles.ru/

Пишем красиво!
Просто набираем текст, указываем его размер, цвет, жмем готово
и получаем готовый XTML текста.

Помогает скачивать файлы со многих популярных сайтов

Бесплатные программы-каждый день разные

Giveaway of the Day

На сайте собрано все для дизайна.
Фоны, html коды, шрифты, флешки, разделители,
Флеш часы, флеш календари, и много много полезных советов

Самая лучшая анимация gif, футажи.

Анимированнные надписи и подписи- легко!

Скачиваем свой дневник на компьютер.

http://www.liveinternet.ru/users/ЛОГИН/export -

вместо слова ЛОГИН пишем свой логин, вставляем

все в строку браузера и скачиваем свой дневник

в папку на рабочем столе.

Делаем слайдшоу онлайн - http://www.crazyprofile.com/slide_show/slideshow.asp

playcast -

увлекательный сайт любителей музоткрыток

Сделай свою музыкальную открытку на сайте
Музыкальные открытки - Muzotkrytka.net и подари друзьям!

Открытка с плеером по формуле:

<center><table style="border:0px none #000000;background-image:url('')" cellspacing="0" cellpadding="0"><tr><td style="padding:15px"><table width="ШИРИНА ФОТО" height="ВЫСОТА ФОТО" style="border:0px none #000000;background-image:url('ПРЯМАЯ ССЫЛКА НА КАРТИНКУ')" cellspacing="0" cellpadding="0"><tr><td style="padding:20px;text-align:center"></span></td></tr><tr><td height="1%" style="text-align:left">ВАШ ПЛЕЕР</span></td></tr></table></td></tr></table> </center>

Окошко для кода -

<*textarea style="text-align: center;" readonly="readonly" cols="45" rows="2" name="S1">

Код рамки или картинки<*/textarea>

Еще такое окошечко для кода:

<*input type='text' size='15' value='ВАШ КОД'>
В этой формуле перед словами ВАШ КОД не забудьте поставить звездочку,

иначе код почему-то сбивается.

Стандартный плеер для ЛиРу - от Legionary

Код вставки:

[flash=326,35,https://img1.liveinternet.ru/images/attach/c/2//3833/3833190_pl_mini1.swf?mp3=ССЫЛКА_НА_ПЕСНЮ]

325 и 35 - размеры плеера,

https://img1.liveinternet.ru/images/attach/c/2//3833/3833190_pl_mini1.swf - ссылка на картинку,

далее еще надо вставить ссылку на песню в mp3.

Плееры с кодом от Роста

1.Аудиоплеер

<audio controls="controls" src="тут ссылка на файл mp3" type="audio/mpeg"></audio>

Аудиоплеер

2.Видеооплеер

Параметр "poster" может отсутствовать. Ширина и высота указывается в пикселях.

3.Музыкальная открытка

По сути это - видеоплеер, но с аудиофалом:
<video controls="controls" width="тут ширина картинки" height="тут высота картинки" poster="тут ссылка на картинку" src="тут ссылка на файл mp3" type="audio/mpeg"></video>
Совет. Чтобы кнопки управления воспроизведением не закрывали картинку, рекомендую добавить сделать внизу картинку что-то примерно на 30 пикселей.

Делаем аудио и видео плееры на uppod.ru - http://uppod.ru/

http://youtubecolor.ru/ -

Подбор параметров плеера для вставки кода с YouTube на ваш сайт

Соотношение сторон видеороликов на YouTube - 16:9.

Чтобы изображение занимало окно плеера полностью, рекомендуется

использовать одно из стандартных разрешений:

1080p (1920 х 1080)

720p (1280 х 720)

480p (854 х 480)

360p (640 х 360)

240p (426 х 240)

Рамка - фон

текст,изображения,текст

<center><table style="WIDTH: 150px;cellspacing=" cellpadding="" border="2" background="http://detsad-kitty.ru/uploads/posts/2011-03/1300685138_2.jpg"><tr><td><font face="arial" color="#000000" size="4" font="font">текст,изображения,текст</font></td></tr></table></center>

Текст с прокруткой, можно вставить в любую рамку.

текст с прокруткой

<div style="overflow-y: scroll; width: 500px; height: 100px;">текст с прокруткой</div><p style="text-align: center;"><span style="font-family:Verdana;color:#000000;font-size:10px"></span></p>

Рамочник

Инструкция по Рамочнику

ФОРМУЛА рамки-коллажа

Автор Tara - gonorata.blogspot.ru

Формула разрезной рамки

<table border="0" cellpadding="0" cellspacing="0"><tr><td align="center"><table border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><table border="0" background="АДРЕС ВЕРХНЕЙ КАРТИНКИ 1" cellpadding="0" cellspacing="0"><tr><td align="center" width="ШИРИНА ВЕРХНЕЙ КАРТИНКИ 1" height="ВЫСОТА ВЕРХНЕЙ КАРТИНКИ 1"><font color="#000000" style="font-size:20px"></font></td></tr></table></td></tr><tr><td align="center"><table border="0" background="АДРЕС СРЕДНЕЙ КАРТИНКИ 2" cellpadding="0" cellspacing="0"><tr><td align="center" width="ШИРИНА СРЕДНЕЙ КАРТИНКИ 2"><font color="#000000" style="font-size:20px"><TABLE align="center" border=0 cellSpacing=0 cellPadding=0><TR> <TD width="ШИРИНА ТЕКСТА"><text face="ЗДЕСЬ СТАВИМ НАЗВАНИЕ ВАШЕГО ШРИФТА"><text size="ЗДЕСЬ РАЗМЕР ШРИФТА ОТ 1 ДО 10"><text color="ЗДЕСЬ ЦВЕТ ШРИФТА"><b><center>ЗДЕСЬ БУДЕТ ВАШ ТЕКСТ</center></b></text></text></text></font></td></tr></table></td></tr><tr><td align="center"><table border="0" background="АДРЕС НИЖНЕЙ КАРТИНКИ 3" cellpadding="0" cellspacing="0"><tr><td align="center" width="ШИРИНА НИЖНЕЙ КАРТИНКИ 3" height="ВЫСОТА НИЖНЕЙ КАРТИНКИ 3"><font color="#000000" style="font-size:20px"></font></td></tr></table></td></tr></table></td></tr></table>

Ваш текст

<span style="font-family:Monotype Corsiva;font-size:28px;text-shadow:2px 1px 2px #666, -1px -1px 3px #FFF, 1px 1px #666, -1px -1px #FFF;color:#09800a;"><i>Ваш текст</i></span>

Меняем название шрифта: Monotype Corsiva - на другое,
размер шрифта: 28px - на какой хотим,
цвет шрифта: color:#09800a - тоже можно менять вот здесь-
http://www.colorhexa.com/22252e,
можно менять размеры и цвет теней - text-shadow.
http://trace.wisc.edu/contrast-ratio-examples/ TextSamples_6x6x6_On_669966.htm

Шрифты для оформления постов в дневнике на Лиру

Ваш текст

Вместо Georgia вставляете любое другое наименование шрифтов: Arial, Arial Narrow,

Times New Roman, Garamond, Courier New, Lucida Grande, Trebuchet, Tahoma,

Verdana, Monotype Corsiva, Wingdings, Comic Sans и др.

Делаем баннер или ссылка на сайт

<a href="ссылка на сайт" target="_blank"><img src="ссылка на изображение" border="0" title="надпись

при наведении мышки на баннер "width="ширина" height="высота" /></a>

Делаем ссылку на нужную страницу, сайт:

Мой дневник

<*a href="http://www.liveinternet.ru/users/marmuh/blog/" target="_blank">Мой дневник<*/a>

Расширенный HTML онлайн Редактор - про запас!

Расширенный редактор онлайн, на котором можно составлять посты,

а потом переносить в новую запись на Лиру.

Калькулятор - флешка

Оптимизатор изображений -

чтоб уменьшить вес картинок сжимаем изображения онлайн
http://optimizilla.com/ru/

Интересные Сайты

http://www.deviantart.com/
http://alena-48.deviantart.com/

Коды HTML для оформления постов, блогов - от Arnusha

Коды для оформления блога

Окошко для кода -
Рамочка вокруг текста -
Рамочка вокруг текста (разрыв слева) -
Рамочка вокруг текста (разрыв справа) -
Картинки в записи
Картинка слева от текста -
Картинка справа от текста -
Картинки по бокам текста - Картинки в ряд:
2 картинки -
3 картинки -
4 картинки -
5 картинок -
6 картинок -
Кнопки в записи
Текст на кнопке -
Картинка на кнопке -
Текст и картинка на кнопке -
Кнопка на фоне -
Номера страниц в блоге -
Рамка с картинками по углам -
Таблица -