Шпаргалка по HTML. Обсуждение на LiveInternet - Российский Сервис Онлайн-Дневников

<hr> - Линия:

<br/> - Перенос по строке вниз;
title="ТЕКСТ" - всплывающая подсказка;
        - пробел;
<u>Ваш текст</u> - Подчеркнутый;
<s>Ваш текст</s> - Перечеркнутый;
<b>Ваш текст</b> - Полужирный;
<big>Ваш текст</big> - Полужирный крупный;
<i>Ваш текст</i> - Курсив;
<tt>шрифт "пишущая машинка"</tt> - шрифт "пишущая машинка"
<blockquote>цитата</blockquote> - цитата

Таблица:<table border=0 widht=52%> -
таблица (начало)
<tr> - строка (начало);
</tr> - конец строки;
Между символами <td> и </td> заключается отдельная ячейка таблицы;
</table> - конец таблицы.
Подробнее о таблицах здесь

Убрать под кат:
<cut text="Читать далее/ смотреть все картинки/и т.п."> Ваш текст, который нужно убрать под кат </cut>

Выравнивание текста:
<div align=right> ваш текст </div> - выравнивание по правому краю;
<div align=justify> ваш текст </div> - выравнивание по всей ширине текста;
<center>ваш текст, картинка</center> - центрирование.

Списки HTML

Нумерованный список

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

<ol type=1><li>первый элемент</li>
<li>второй элемент</li>
.....
<li>N - элемент</li>
</ol>

первый элемент
второй элемент
......
N - элемент

<ul type=disc>
<li>первый элемент</li>
<li>второй элемент</li>
.....
<li>N - элемент</li>
</ul>

первый элемент
второй элемент
......
N - элемент

Окошко для вставки кода:
1.
<textarea rows="2" cols="40"> ВАШ КОД </textarea> , где cols - ширина окошка в px, а rows - число строк в окне.
ВАШ КОД
2.

<input type='text' size='15' value='Ваш код'>

Изменяем шрифт, размер и цвет текста:
<span style="font-family:Monotype Corsiva;color:fuchsia;font-size:25px">Ваш текст</span> , где font-family - шрифт, color - цвет, font-size - размер.
подробнее читать здесь

Оформление ссылок:
<a href="АДРЕС СТРАНИЦЫ"> ВАШ ТЕКСТ</a>
<a href="АДРЕС СТРАНИЦЫ"><img src="АДРЕС КАРТИНКИ"></a> - кликабельная картинка,
<a href="АДРЕС СТРАНИЦЫ" target="_blank">ВАШ ТЕКСТ</a> - ссылка откроется в новом окне.
подробнее читать здесь

Кнопка с выпадающим списком:
копируем код из окошка

<form action="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://freiman.info/files/link.php"" target="_blank">http://freiman.info/files/link.php"</a> method="GET"><br /><input type="hidden" name="h" value="_self" /><br /><select id="links" name="links"><br /><option value="ССЫЛКА">НАЗВАНИЕ</option><br /><option value="ССЫЛКА">НАЗВАНИЕ</option><br /><option value="ССЫЛКА">НАЗВАНИЕ</option><br /><option value="ССЫЛКА">НАЗВАНИЕ</option><br /><option value="ССЫЛКА">НАЗВАНИЕ</option><br /></select> <input type="submit" value="НАДПИСЬ НА КНОПКЕ" /><br /></form>
Копируем код и вставляем в новую запись в формат HTML, вместо слова ССЫЛКА пишем необходимый URL адрес (ссылку, по которой нужно перейти)
Вместо слова НАЗВАНИЕ пишем описание этой ссылки (например: главная страница)
Вместо фразы НАДПИСЬ НА КНОПКЕ пишем слово, которое будет написано на кнопке, при нажатии на которую, мы перейдём на нужную страницу (например, Перейти)

Пишем на картинке:
копируем код из окошка
<center><table background="АДРЕС КАРТИНКИ"><tr><td width="ширина картинки" height="высота картинки"><span >ВАШ ТЕКСТ</text></td></tr></table></center>
подробнее читать здесь

Обтекание картинки текстом:
<img src="http:…" align=left hspace=20 vspace=20> , где align=left – картинка слева, текст справа
align=right - картинка справа, текст слева
hspace=20 - расстояние между текстом и картинкой 20 пикселей по горизонтали
vspace=20 - расстояние между текстом и картинкой 20 пикселей по вертикали

Ваш текст 1
Ваш текст 2

<center><font style="font-size:55px;line-height:19px;color: #3300CC;font-family: Impact;">Ваш текст 1<br><font style="font-size:45px;color: #FF0066;font-family: Impact;">Ваш текст 2</font></font></text></center><br><br><br /><span style="font-family:Arial;color:#000000;font-size:12px">Основной текст</span>
Подробнее читайте здесь

Вставка флэш:
<object type=application/x-shockwave-flash data=ссылка-на-файл width=450 height=300><param name=movie value=ссылка-на-файл></object>

, где "ссылка-на-файл" - адрес файла,
width=450 height=300 - размеры флэш (можно менять)

Делаем рамочки:
<div style="background:url(ссылка на картинку);border-style;ridge-color#XXXXXX;padding;Xpx;"><div style="background:url(ссылка на картинку);border-style:insert/double/или др.;ridge;color#XXXXXX;padding:Xpx;"><div style="background:url(ссылка на картинку);border-style;ridge-color#XXXXXX;padding;Xpx;"> <div style=text-align:center;font:Arial;font-style:italic;color:#XXXXXX;padding;Xpx;">Ваш текст</span></div></div></div>,
где background - фон слоя; border-style - стиль бордюра; ridge - ранг; color -цвет; padding - ширина рамки в пикселях.
Для текста: text-align:center - параметры выравнивания текста (центрирование); font - шрифт; font-style - стиль шрифта (italic - наклонный); color - цвет; padding - отступы.
подробнее читать здесь

Кнопка

<form action="http://....." target="_blank" method="get"><button type="submit"><img src="адрес картинки" align="absMiddle" /> надпись</button></form>

Бегущая строка

*< font size="5" color="red">Текст бегущей строки.* <marquee behavior="alternate" bgcolor="yellow" scrolldelay="145" width="50%">< font size="5" color="red">Текст бегущей строки. </font></marquee> <br /> </FORM>, где bgcolor-цвет фона.	флэш-генератор:

Фон для текста

ВАШ ТЕКСТ

<table border="0" cellspacing="8" cellpadding="0" width="100%"background="Адрес фона"><tbody><tr><td><p><br/></a><p><CENTER> <span style="font-family:Monotype Corsiva;color:black;font-size:25px"><b>ВАШ ТЕКСТ</b></span> </CENTER></p></td></tr></tbody></table> <br />, где:
border="1" - толщина рамки, cellspacing="4" - расстояние между ячейками, cellpadding="25" - отступ содержимого таблицы от рамки. Все эти значения можно менять. Подробнее читайте здесь

Flash-программа "Подбор цвета HTML"

Источник Flash
Кнопочки на эту шпаргалку:

	<a href="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://natalya84i.blogspot.com/2010/07/html-html-title-border0-widht52.html"><img" target="_blank">http://natalya84i.blogspot.com/2010/07/html-html-t...-widht52.html"><img</a> src="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//s003.radikal.ru/i201/1006/c4/1f6f5670e1cd.png"" target="_blank">//s003.radikal.ru/i201/1006/c4/1f6f5670e1cd.png"</a> ></a>
	<a href="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://natalya84i.blogspot.com/2010/07/html-html-title-border0-widht52.html"><img" target="_blank">http://natalya84i.blogspot.com/2010/07/html-html-t...-widht52.html"><img</a> src="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//s11.radikal.ru/i184/1006/02/1cc08c644a70.png"" target="_blank">//s11.radikal.ru/i184/1006/02/1cc08c644a70.png"</a> ></a>
	<a href="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://natalya84i.blogspot.com/2010/07/html-html-title-border0-widht52.html"><img" target="_blank">http://natalya84i.blogspot.com/2010/07/html-html-t...-widht52.html"><img</a> src="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//s006.radikal.ru/i215/1006/f2/cde0276c6499.png"" target="_blank">//s006.radikal.ru/i215/1006/f2/cde0276c6499.png"</a> ></a>
	<a href="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://natalya84i.blogspot.com/2010/07/html-html-title-border0-widht52.html"><img" target="_blank">http://natalya84i.blogspot.com/2010/07/html-html-t...-widht52.html"><img</a> src="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//s16.radikal.ru/i190/1006/d3/47e823ab2e50.png"" target="_blank">//s16.radikal.ru/i190/1006/d3/47e823ab2e50.png"</a> ></a>
	<a href="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=http://natalya84i.blogspot.com/2010/07/html-html-title-border0-widht52.html"><img" target="_blank">http://natalya84i.blogspot.com/2010/07/html-html-t...-widht52.html"><img</a> src="<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=//s42.radikal.ru/i097/1006/43/efe1d4914396.png"" target="_blank">//s42.radikal.ru/i097/1006/43/efe1d4914396.png"</a> ></a>