HTML для чайников/подборка уроков

HTML для чайников Для тех кто хочет учиться, много полезной информации. Подробные уроки по htmlДля тех кто хочет учиться, много полезной информации. <center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://www.site-do.ru/html/html.php">Подробные уроки по html</a> </center><a target="_blank" href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://www.site-do.ru/html/html.php"><img src="http://site-do.ru/images/sitedo3.gif" alt="Уроки HTML" /></a> Урок 1. Что такое HTML, основные понятия Урок 2. Структура html документа Урок 3. Форматирование текста Урок 4. Форматирование текста (продолжение) Урок 5. Специальные символы Урок 6. Ссылки в html Урок 7. Создание списков Урок 8. Работа с изображениями Урок 9. Работа с таблицами - тег table Урок 10. Работа с таблицами сложной структуры Урок 11. Работа с формами Урок 12. Фреймы в html Урок 13. Музыка в html Урок 14. Встраивание произвольных объектов Урок 15. Навигационные карты - map <a target="_blank" data-cke-saved-href="http://www.site-do.ru/js/js.php" href="http://www.site-do.ru/js/js.php"><img data-cke-saved-src="http://site-do.ru/images/sitedo4.gif" src="http://site-do.ru/images/sitedo4.gif" alt="Уроки javascript" /></a> Prudent

Генератор таблиц-онлайн всех HTML кодов

 

Что такое HTML. Видео-уроки: HTML с нуля

Как мне не хочется изучать язык HTML, однако вести блог и не знать хотя бы азов - невозможно. Не хочу (!!!) - но придется.


Кайфующий, ленивый леопард. © Автора укажу после того, как найду его имя в Гугле.

Итак, видео-урок №1. Читать далее...

Учебник HTML для начинающих




ПАМЯТКА НАЧИНАЮЩИМ БЛОГЕРАМ

Учебник HTML для начинающих


Оглавление

Введение

Структура HTML-документа

Форматирование текста

Управление цветом

Рисунки на Web-страничке

Гиперссылки

Таблицы

Разметка Web-страницы при помощи таблицы

для вас Лариса Гурьянова

Серия сообщений "Полезные ссылки":

Часть 1 - Просто полезный пост!!!
Часть 2 - Словари и автоматические переводчики в сети
...
Часть 26 - Фото-приколы с вашими фото он-лайн...
Часть 27 - Легко скачиваем видео к себе на компьютер!!!
Часть 28 - Учебник HTML для начинающих
Часть 29 - Энциклопедия ЛиРу
Часть 30 - Программа Рaint.net
Часть 31 - Ресурсы для скачивания музыки MP3 на компьютер

Генератор BB и Html кодов для вставки изображений в блог

Очень полезный сервис, особенно для начинающих,но и опытным пользователям он будет не лишним! Генератор BB и Html кодов для вставки изображений на сайт или блог. Этот генератор может сделать для вас очень многое.
1. Построит картинки в ряд, то есть сам сделает за вас таблицу.
2.Сам переведет вашу картинку в Html коды.
3. Сделает за вас окошечки с кодами для вставки.

То,что раньше надо было сначала ставить специальные таблицы ,потом нужно было вставить туда коды картинок и еще умудрится под ними коды в рамочке засунуть.Это могли делать только умудренные пользователь.Теперь всё упростилось в тысячу раз!!

Думаю даже то, что я вам сейчас написала, для многих не очень понятно. Поэтому постараюсь все объяснить попроще.
Читать далее
Из блога ГАЛИНЫ ШАДРИНОЙ

КАК КОПИРОВАТЬ КОД КАРТИНКИ

ВСЕ МОИ УРОКИ ЗДЕСЬ Многие новички не знают как копировать код картинки. ПЕРВЫЙ ВАРИАНТ Я расскажу для тех, кто пользуется Google Chrome. Находите красивую картинку (у друга в дневнике или в интернете), кликаете по этой картинке правой кнопкой

Читать далее...

Всё о HTML...начинающим и не только...

А вот еще одна маленькая хитрость. Вы хотите поставить рамочку или картинку или часики по центру, а они ну никак не встают и даже, если Вы применили теги <center></center>. Не буду заморачивать долго голову; почему так происходит, А просто скопируйте вот этот код <div align="center"> и вставьте его в самом начале кода своей рамочки или картинки Вот они и в центре!Все так просто!! Если надо поставить картинку слева или справа, то в коде вместо center поставьте теги left и right И еще раз о NTML-кодах буквально для новичков и не только... Код краткой шпаргалки для Вашего блога Принципы HTML Как вставлять готовые коды Разделительные линии Способы выделения текста Списки HTML Бегущая строка Шрифты HTML Как изменить размер, цвет и шрифт текста Красивый текст Убрать под кат Цвета HTML Flash-программы по подбору цвета Таблица цвета HTML, буквенное написание Таблица HTML Как быстро скопировать изображение Как защитить изображение от копирования Фон для записи Как написать на картинке без фотошопа Оформление ссылок Кнопки для сайта Интерактивное изображение Как сделать бродилку составление кнопок бродилки в виде таблицы, имитац... Как изменить размер плеера Вставка Flash Окошко для кодов HTML-редактор Шпаргалка по HTML для блоггера Arnusha

Спасибо NATALKA

ШРИФТЫ С КОДАМИ

ШРИФТЫ С КОДАМИ
Собирала шрифты для себя, но решила поделиться со своими друзьями, может кому пригодятся. Все составляющие можно менять: название шрифта, номер или название цвета, высоту текста на ваше усмотрение.

Белая береза
<font face="Monotype Corsiva" size="+4" color="fuchsia"> Белая береза</font>

Под моим окном
<font face="Georgia" size="+4" color="Blue">Под моим окном</font>

Принакрылась снегом
<font face="MS Mincho" size="+4" color="Red">Принакрылась снегом</font>

Точно серебром
<a><font face="Impact" size="+4" color="Lime">Точно серебром</font></a>

ПОЗДРАВЛЯЮ!
<font face="Goudy Stout" size="7"><font color="#9933FF">П</font><font color="#CC00FF">О</font><font color="#FF99FF">З</font><font color="#FFCCFF">Д</font><font color="#CC0099">Р</font><font color="#FFCCFF">А</font><font color="#CC0099">В</font><font color="#9900FF">Л</font><font color="#9933FF">Я</font><font color="#0099D9">Ю</font><font color="#CC00FF">!</font></font>

СпАсИбО!
<font face="Emmett" size="7"><font color="#CCFFFF">С</font><font color="#00FF99">п</font><font color="#00FF00">А</font><font color="#99FF00">с</font><font color="#CCFF33">И</font></font><font color="#CCFFFF">б</font><font color="#00FF99">О</font><font color="#00FF00">!</font>

Приятного вечера!
<font face="Comic Sans MS" size="+4" color="fuchsia"> С Приятного вечера!</font>

С Добрым утром!
<font face="Courier New" size="+4" color="Navy"> С Добрым утром!</font>

Спокойной ночи.
<font face="Garamond" size="+4" color="Purple"> С Спокойной ночи.</font>

ПОЗДРАВЛЯЮ!
<font face="System" size="+6" color="Red"> С ПОЗДРАВЛЯЮ!</font>

Благодарю!
<font face="Wingding" size="+4" color="Violet">Благодарю!</font>


Спокойной ночи.
<font face="Tahoma" size="+3" color="Blue">Спокойной ночи.</font>

Спокойной ночи.
<font face="Verdana" size="+3" color="Green">Спокойной ночи.</font>

Спокойной ночи.
<font face="Arial" size="+3" color="Fuchsia">Спокойной ночи.</font>

Спокойной ночи.
<font face="Trebuchet MS" size="+3" color="Aqua">Спокойной ночи.</font>

Спокойной ночи.
<font face="Times" size="+4" color="Navy">Спокойной ночи.</font>

Привет подружка!
<font face="Garamond" color="Green" style="font-size:40px"><i><b>Привет подружка!</b></i></font>

Прекрасного утра!
<a><font face="Comic Sans MS" color="#C71585" style="font-size:40px"><i><b>Прекрасного утра!</b></i></font></a>


Благодарю!
<a><font face="Wingding" color="#1E90FF" style="font-size:40px"><i><b>Благодарю!</b></i></font></a>

МОЛОДЕЦ!
<a><font face="Tahoma" color="#00FFFF" style="font-size:40px"><i><b>МОЛОДЕЦ!</b></i></font></a>

С началом лета!
<a><font face="Wingding" color="#00FF00" style="font-size:40px"><i><b>С началом лета!</b></i></font></a>

Какая красота!
<a><font face="Monotype Corsiva" color="#FF00FF" style="font-size:40px"><i><b>Какая красота!</b></i></font></a>

Просто прелесть!
<a><font face="System" color="#FFFF00" style="font-size:40px"><i><b>Просто прелесть!</b></i></font></a>

Чудесный пост!
<a><font face="Times New Roman" color="#00FA9A" style="font-size:40px"><i><b>Чудесный пост!</b></i></font></a>

Доброй ночи!
<a><font face="Courier New" color="#9400D3" style="font-size:40px"><i><b>Доброй ночи!</b></i></font></a>

Генератор таблиц

 С помощью этого генератора можно создать любую таблицу. Заполните необходимые поля и нажмите кнопку Create Table. В открывшемся окошке вы увидите созданную вами таблицу, и HTML код созданной таблицы

ДЕЛАЕМ НАДПИСЬ НА КАРТИНКЕ.

ДЕЛАЕМ НАДПИСЬ НА КАРТИНКЕ.

Я всегда рада видеть Вас в моем блоге!

Скопируйте эту формулу и вставьте СВОИ параметры ЛЮБОЙ картинки!
Если вам надо опустить чуть ниже текст
то перед текстом нужно поставить несколько вот таких тегов<br />
<center><table background="АДРЕС КАРТИНКИ РАДИКАЛ-1"><tr><td width="ширина картинки" height="высота картинки"><center><font face="шрифт текста"><font size="4"><font color="#000000"><b>Ваш текст</b></font></font></font></center></td></tr></table></center>
Значения в кавычках можно менять.

Например, размер букв font size="4". Если цифру 4 изменить на большую, то и буквы в тексте станут больше, если поставить цифру меньше, то и размер букв станет меньше. Цвет букв font color="#000000". Если вместо 000000 (так обозначается черный цвет), поставить ffffff (так обозначается белый цвет), то и буквы станут белого цвета. Шрифт написания букв face="Monotype Corsiva". Если вместо названия шрифта Monotype Corsiva написать Arial или Georgia то написание букв изменится.
Теги center - картинка или текст распологаются по центру.

ПРИВЕТИК!

ЖЕЛАЮ УДАЧИ!

Дневник Nataliya_Bezyshko

Дорогие друзья и гости! Кому некогда или лень писать комментарии... если не трудно, отмечайте внизу слева в посте: ПОНРАВИЛОСЬ!"

Серия сообщений "МОИ УРОКИ":

Часть 1 - Урок 1. Делаем простую рамочку из 2-х слоев.
Часть 2 - Как скопировать код рамки из окошка и перенести рамку в свой дневник.
...
Часть 7 - Урок 5. Делаем вместе рамку с уголками.
Часть 8 - ДЕЛАЕМ ОКОШКО ДЛЯ КОДА.
Часть 9 - ДЕЛАЕМ НАДПИСЬ НА КАРТИНКЕ.
Часть 10 - Делаем сами музыкальную открытку.
Часть 11 - Как сделать самому баннер.
...
Часть 20 - УРОК. РАМКА В РАМКЕ...
Часть 21 - LiveInternet – Отношения
Часть 22 - Уменьшаем большую картинку.

СКРИПТЫ И ФИШКИ... ПОЖАЛУЙСТА, БЕРИТЕ....ЖМИТЕ НА ТЕКСТ.

СКРИПТЫ И ФИШКИ...

Полезные скрипты
Меню как на Маке (полный вау)
Как поставить комменты на сайт Как сделать маленькие часики на сайт
Как сделать календарик на сайт
Блок с закругленными краями
Перевод сайта на английский язык
ИЦ и PR - разбираемся и проверяем
Как сделать тест на сайте
Скрипт 'Эффект для титульной строки'
Прикольные символы HTML
Бегущая строка и прокрутка для баннеров
Как поставить музыку на сайт
Как раскрасить полосу прокрутки (только для Internet Explorer)
Готовые полосы прокрутки
Как сделать забавную надпись Crazy Pages
Глиттеры
Скрипт 'Палитра'
Таблица WEB - цветов с подбором
Меняем кнопки на форуме
Фишка кода для баннера
Скрипт 'Случайная картинка'
Текст с тенью
Приветствие по времени суток

Помощники и генераторы:


Помощник в создании таблиц
Помощник в создании баннеров
Помощник в создании менюшки
Помощник в создании ифреймов
Генератор всплывающих окон
Генератор мета - тегов

Часики и курсоры:


Часики на сайт
Курсор для всех браузеров
Разноцветные стрелки и необычные курсоры (только для Internet Explorer)
Девочки, куколки и человечки (только для Internet Explorer)
Зверюшки, бабочки и мультяшки (только для Internet Explorer)
Сладости, фрукты и цветы (только для Internet Explorer)
Сердечки, звёздочки и музыка (только для Internet Explorer)
Курсор 'Санта на оленях'
Эффект для курсора 'Звёздочки'

Эффекты для ссылок:


Эффект прозрачности для картинок и баннеров
Разные эффекты для ссылок
Забавный эффект для ссылок
Всплывающие подсказки для ссылок
Смена картинки при наведении на ссылку

Эффекты для фона:


Нежные блёстки на странице (IE & Opera)
Листопад (IE & Opera)
Ещё один листопад
Танцующие бабочки
Кружится снежок
Падают снежинки
Шарики поднимаются в небо
Мыльные пузыри
Ленточка ко Дню Победы
Шторки
Эффект для фона 'Круг' (только для Internet Explorer)
Эффект для фона 'Мозайка' (только для Internet Explorer)
Разные эффекты для фона (только для Internet Explorer)

Эффекты для картинок:


Фотоальбом на сайте
Карусель из картинок
Скрипт 'Книга'
Виды рамок для картинки
Красивое увеличение картинки
Мозайка из картинок

Маркированные списки:


Обычные маркеры
Маркеры - картинки
Нумерованные списки
Пиксельные картинки для списков

КАК СДЕЛАТЬ ОКОШКО С КОДОМ ПОД КАРТИНКОЙ

У вас есть открытка, рамочка, картинка , которую вы хотите подарить друзьям. Для этого под этой картинкой ставится окошко с кодом этой картинки. Как же это сделать? В окно сообщения вы вставляете код картинки:

Читать далее...

Полезно: О дневниках HTML - супер сайт!

	Google   Google AdSense для заработка на blogger Виджет “Постоянные читатели” Как заменить звук в видео Как зарегистрироваться на google+ Как установить счетчик Feedburner Переводчик в вашем блоге/сайте Подарочный сертификат от Google Поиск от Google способ №2 Приколы на сайтах Простой способ привлечения посетителей в блог ТИЦ и pr Яндекс. Новая авторизация HTML [ Читать далее... → ]

Взяла на Майл ру

http://blogs.mail.ru/mail/mirela_monika/762E1FE4B9D989CC.html

 

Как правильно записать код флешки или видео в рамочку для кодов.

Для тех у кого возникли проблемы с правильным отображением кодов для флешек и видео в поле тега textarea.
Разбираясь с проблемой, я обнаружила, что все дело в том, что при написании текста для окошечек кодов нельзя использовать символы скобок, которые мы вводим с компьютера.(т.е. "<" или "[" ) Необходимо использовать их специальные кодовые обозначения. В табличке даны такие коды скобок. Как вы знаете для размещения флешек и видео на Лиру используются квадратные скобки "[; ]", но можно использовать и запись типа "embed src= " с треугольными скобками "<; >" Ниже привожу такие кодовые обозначения

Название	Символ	Код
Скобка квадратная левая	[	[
Скобка квадратная правая	]	]
Скобка треугольная левая	<	&lt;
Скобка треугольная правая	>	&gt;

Ниже привожу фото написания кодов, так как Лирушный редактор вживую написать их не дает. Для флешек и видио запись с кодом для окошечка будет выглядеть так

[flash=288,360,http://novprospekt.narod2.ru/moi_fleshki/Untitled8f.swf]
или так

<embed src="http://novprospekt.narod2.ru/moi_fleshki/Untitled7.swf" width="380px" height="190px" type="application/x-shockwave-flash" quality="high" wmode="transparent">

Во втором случае редактор сам переделает код для вставляемой флешки и видео в запись первого вида. В окошечке же останется оригинальный код, который, кстати можно использовать в дневничках других ресурсов, например на Я-ру

Серия сообщений "Flash":
Часть 1 - Делаем элементарные часики.Начинаем учиться созданию flash.
Часть 2 - Как правильно записать код флешки или видео в рамочку для кодов.
Часть 3 - Часики-приветствия.
Часть 4 - Флешки-часики "Halloween"
...
Часть 6 - Создаем флешки в программе Aleo Flash Intro Banner Maker.Часть первая.
Часть 7 - Пошаговая инструкция по созданию флешролика в программе Aleo Flash Intro Banner Maker.
Часть 8 - "До Рождества осталось..." Обратный отсчет.

Серия сообщений "флеш-информеры,часики":
Часть 1 - Ура, я научилась делать часики.
Часть 2 - Как правильно записать код флешки или видео в рамочку для кодов.
Часть 3 - Часики-приветствия.
Часть 4 - Часики "Дельфин и Русалка" с эффектом "Ripple".
...
Часть 11 - Создаем флешки в программе Aleo Flash Intro Banner Maker.Часть первая.
Часть 12 - Пошаговая инструкция по созданию флешролика в программе Aleo Flash Intro Banner Maker.
Часть 13 - "До Рождества осталось..." Обратный отсчет.

Учимся вставлять Картинки с кодами в таблицу.

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

none #000000;background-image:url(//s46.radikal.ru/i111/1003/67/d84a0966432d.gif);padding:7px">

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

УРОКИ HTML

Уроки HTML расчитаны на "новичков". Если же вы не знаете для чего нужен HTML и как создать html-страничку, то ознакомьтесь сначала с серией уроков Делаем сайт - первые шаги, а потом возвращайтесь сюда. Урок 1. Что такое HTML, основные понятия Урок 2. Структура html документа Урок 3. Форматирование текста Урок 4. Форматирование текста (продолжение) Урок 5. Специальные символы Урок 6. Ссылки в html Урок 7. Создание списков Урок 8. Работа с изображениями Урок 9. Работа с таблицами - тег table Урок 10. Работа с таблицами сложной структуры Урок 11. Работа с формами Урок 12. Фреймы в html Урок 13. Музыка в html Урок 14. Встраивание произвольных объектов Урок 15. Навигационные карты - map

Лорик

ДЕЛАЕМ ОКОШКО ДЛЯ КОДА.

ДЕЛАЕМ ОКОШКО ДЛЯ КОДА. Часто мы видим, как под рамкой или под картинкой стоит окошко с кодом рамки или картинки и не задумываемся над тем, что это такое и как это сделать. Сделать самим такое окошко совсем не сложно. ВАША КАРТИНКАПРОДОЛЖЕНИЕ ТУТ... Пробуйте, у Вас получится! ЖЕЛАЮ УДАЧИ! Дневник Nataliya_Bezyshko

Дорогие друзья и гости! Кому некогда или лень писать комментарии... если не трудно, отмечайте внизу слева в посте: ПОНРАВИЛОСЬ!"

Серия сообщений "МОИ УРОКИ":

Часть 1 - Урок 1. Делаем простую рамочку из 2-х слоев.
Часть 2 - Как скопировать код рамки из окошка и перенести рамку в свой дневник.
...
Часть 6 - Урок 4. Делаем вместе рамочку из 6-х слоев
Часть 7 - Урок 5. Делаем вместе рамку с уголками.
Часть 8 - ДЕЛАЕМ ОКОШКО ДЛЯ КОДА.
Часть 9 - ДЕЛАЕМ НАДПИСЬ НА КАРТИНКЕ.
Часть 10 - Делаем сами музыкальную открытку.
...
Часть 19 - Урок. Ваш компьютер не читает программы на русском языке? Как это исправить?
Часть 20 - УРОК. РАМКА В РАМКЕ...
Часть 21 - LiveInternet – Отношения

~ HTML - шпаргалка

http://verano.ucoz.ru/HTML.html

Это просто клад-3

ТЕГИ HTML.   КАК СДЕЛАТЬ ПОЛЕЗНЫЕ ССЫЛКИ    СПЕЦСИМВОЛЫ   ССЫЛКИ НА ДР.РЕССУРСЫ   ТАБЛИЦА ЦВЕТОВ HTML   ТАБЛИЦА ЦВЕТОВ НА АНГЛ.ЯЗ.   ТАБЛИЦА ЦВЕТОВ HTML.

Читать далее