Школа Лизы Чёрной

HTML коды, полезные для ЖЖ и сайта

Изображения

Текст «обтекает» картинку:	<img src="ADRES KARTINKI" width="250" align=left hspace=20 vspace=15><br /> <img src="ADRES KARTINKI" width="250" align=right hspace=20 vspace=15>
Прекратить обтекание картинки: All — завершить обтекание объекта текстом. Left — по левому краю. Right — по правому краю.	<br clear="All"><br /> <br clear="left"><br /> <br clear="Right">
Вставка картинки или с заданной шириной, или по центру с заданной шириной	<img src="ADRES KARTINKI"><br /> <img src="ADRES KARTINKI" width="250"></p> <div align=center><img align="absmiddle" src="ADRES KARTINKI" width="250"></div> <p>
Картинки с рамкой	<img src="ADRES KARTINKI" style="border:1px solid red;">
	</p> <div align=center><a href="ADRES STRANICI" title="POYASNITELNIY TEXT"><img align="absmiddle" src="ADRES KARTINKI" width="500"></a></div> <p>
Расположение картинки-ссылки по center или left, или right	</p> <div align=center><a target="_blank" href="ADRES SSILKI"><img align="absmiddle" src="ADRES KARTINKI"></a></div> <table border="0" style="float: left; margin: 0 5px 2px 0;"> <tr> <td> <a target="_blank" href="ADRES SSILKI"><img align="absmiddle" src="ADRES KARTINKI"></a> </td> </tr> </table> <table border="0" style="float: right; margin: 0 5px 2px 0;"> <tr> <td> <a target="_blank" href="ADRES SSILKI"><img align="absmiddle" src="ADRES KARTINKI"></a> </td> </tr> </table> <p>

 Закрепитель:
Я
  Пешу
                лесинкой

Оформление ссылок:

lizi-black Ссылка с всплывающей подсказкой: просто ссылка	<a href="ADRES STRANICI">TEXT</a> <a href="ADRES STRANICI" title="а это – подсказка!">просто ссылка</a>
Эффект подсветки ссылки (наведите курсор на текст): Школа Lizi_Black	<a href="ADRES STRANICI"><font onmouseover="style.backgroundColor='CornflowerBlue'; style.cursor='hand'" onMouseOut="style.backgroundColor='silver';">TEXT SSILKI</font></a>
Ссылка, открывающаяся на новой странице	<a href="ADRES STRANICI" target="_blank">PODZAGOLOVOK</a>
Картинка-ссылка на веб-страницу	<a target="_blank" href="ADRES SSILKI"><img align="absmiddle" src="ADRES KARTINKI"></a>
В том же окне + «всплывающая подсказка» при наведении курсора.	<a href="ADRES SSILKI" title="Пояснительный текст"><img align="absmiddle" src="ADRES KARTINKI"></a>
Написать	</p> <form action="ADRES SSILKI" target="_blank" method="get"><button type="submit"><img src="ADRES KARTINKI" align=absMiddle>TEXT</button></form> <p> </p> <form action="адрес страницы" method="get"><input type="submit" value="ссылка на страничку"></form> <p>
	<lj user="ник/логин">
	<lj comm="vikka93">
	<lj user="НИК ЮЗЕРА" title="ПСЕВДОНИМ">
Вставка МЕДИАФАЙЛА	<lj-embed>KOD VSTAVKI</lj-embed>
Ссылка на электронную почту	<a href="mailto:E-MAIL ADRES">TEXT SSILKI</a>

Оформление таблиц

Заготовка для стандартной таблицы: Заголовок 1 2 3 4 5 6 7 8	</p> <table border="5" cellspacing="5" cellspacing="5"> <caption><strong><span style="color:red">Заголовок</span></strong></caption> <tr> <th> 1 </th> <th> 2 </th> </tr> <tr> <td> 3 </td> <td> 4 </td> </tr> <tr> <td> 5 </td> <td> 6 </td> </tr> <tr> <td> 7 </td> <td> 8 </td> </tr> </table> <p>
Создать таблицу	</p> <table border=5> <tr> <td>Создать таблицу</td> </tr> </table> <table border="5" style="float: center; margin: 0 5px 2px 0; width:100%;"> <tr> <td>Создать таблицу</td> </tr> </table> <table> <tr> <td>Создать таблицу</td> </tr> </table> <p>
Чтобы текст обтекал таблицу, в первый тег table нужно добавить style=»float: left; margin: 0 5px 2px 0;» для аналогичного обтекания текстом справа: style=»float: right; margin: 0 0 2px 5px;»	</p> <table border="3" cellspacing="5" cellspacing="5" style="float: right; margin: 0 5px 2px 0; 194px;" border="5">Текст обтекает таблицу</table> <p>
Строка в таблице	</p> <tr>Строка в таблице</tr> <p>
ЯЧЕЙКА	</p> <td>ЯЧЕЙКА</td> <p>
Заголовки столбцов в верхней строке таблицы	</p> <tr> <th> 1 </th> <th> 2 </th> <th> 3 </th> </tr> <p>
желтый красный	</p> <table border="5" cellspacing="5" cellspacing="5"> <colgroup style="background-color: yellow"> <col span="2"></colgroup> <colgroup style="background-color: red"> <col> <col></colgroup> <tr> <th colspan="2">желтый</th> <th colspan="2">красный</th> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table> <p>
Потребление пива Ф.И.О. литров Итого 250 Иванов Иван Иванович 133 Петров Петр Петрович 117	</p> <style type="text/css"> table { border-collapse: collapse; } table th, table td { padding: 0 3px; } table tr td:last-child { text-align: right; } table tbody { border-top: 1px solid #000; border-bottom: 1px solid #000; } </style> <table> <caption>Потребление пива</caption> <thead> <tr> <th>Ф.И.О.</th> <th>литров</th> </tr> </thead> <tfoot> <tr> <td>Итого</td> <td>250</td> </tr> </tfoot> <tbody> <tr> <td>Иванов Иван Иванович</td> <td>133</td> </tr> <tr> <td>Петров Петр Петрович</td> <td>117</td> </tr> </tbody> </table> <p>
Цветная ячейка	</p> <td bgcolor="#00CCFF">Цветная ячейка</td> <p>
Прокрашиваем столбцы таблицы. Вначален перед первой строкой, заголовок таблицы по центру: Фестиваль и прочее Заголовок, располагаемый внизу тaблицы Дата Деканат Зодиака Планета Знак Зодиака Масть 21-30 марта 0°-10° ♂ Марс ♈ Овен Жезлы	</p> <table border="5" cellspacing="5" cellspacing="5"> <caption><strong>Фестиваль и прочее</strong></caption> <p><CAPTION ALIGN=BOTTOM><b>Заголовок, располагаемый внизу тaблицы</b></CAPTION></p> <colgroup> <col style="background:#C7DAF0;"> <col span="3" style="background:Khaki"> <col style="background:#C7DAF0;"> </colgroup> <tr> <th>Дата</th> <th>Деканат<br /> Зодиака</th> <th>Планета</th> <th>Знак<br /> Зодиака</th> <th>Масть</th> </tr> <tr> <td> <strong>21-30<br /> марта</strong> </td> <td> 0°-10° </td> <td> ♂ Марс </td> <td> ♈ Овен </td> <td> Жезлы </td> </tr> </table> <p>
Таблица 1 Бла-бла-бла на ширину всех колонок Три материнские буквы Семь двойных букв Двенадцать простых букв א Алеф, Воздух, Дурак 0 ב Бет, Меркурий, Маг I ה Хе, Овен, Император IV מ Мем, Вода, Повешенный XII ג Гимел, Луна, Жрица II ו Вав, Телец, Иерофант V ש Шин, Огонь, Эон XX ד Далет, Венера, Императрица III ז Зайин, Близнецы, Влюбленные VI	</p> <table border="5" cellspacing="5" cellspacing="5"> <caption><strong>Таблица 1</strong></caption> <colgroup style="background:#C7DAF0;"> <col span="3"></colgroup> <tr> <th colspan="3">Бла-бла-бла на ширину всех колонок </th> </tr> <tr> <th>…</th> <th>…</th> <th>…</th> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> <tr> <td>…</td> <td>…</td> <td>…</td> </tr> </table> <p>
Заголовок таблицы, размещаем сразу под table, перед первой тр вверху: Или там же, но будет внизу	</p> <table border="5" cellspacing="5" cellspacing="5"> <caption><strong>Вверху: и прочее</strong></caption> <p><CAPTION ALIGN=BOTTOM><b>Заголовок, располагаемый внизу тaблицы</b></CAPTION><br />
Бл-ы Ж Л Д Я	</p> <table border=3 bordercolor=#180F07 cellpadding=7 width=AUTO> <tr> <td rowspan=2 align=left>Блогсервисы</td> <td>ЖЖ</td> <td>Ли.ру</td> </tr> <tr> <td>Диари</td> <td>Я.ру</td> </tr> </table> <p>
Блогсервисы Ж Л Д Я	</p> <table border=3 bordercolor=99CCFF cellpadding=7 width=40%> <tr> <td colspan=4 align=center><b>Блогсервисы</b></td> </tr> <tr> <td>ЖЖ</td> <td>Ли.ру</td> <td>Диари</td> <td>Я.ру</td> </tr> </table> <p>
Чтобы призвать видимую таблицу с бордюром в стиле Экспрессив, пользуемся этим (остальные детали из обычных кодов для таблиц):	</p> <table class="mytable">Создать таблицу</table> <td class="mytable">ЯЧЕЙКА</td> <p>
Таблица для вставки альбомов с заданными размерами: Tarot of Teen Witches	</p> <table border="3" cellspacing="5" cellspacing="5" style="float: right; margin: 0 5px 2px 0; 194px;" border="5"> <CAPTION ALIGN=BOTTOM><b>NAZVANIE ALBOMA</b></CAPTION></p> <tr> <td align="center" style="height:194px;background:url(http://picasaweb.google.com/s/c/transparent_album_background.gif) no-repeat left"> <a href="ADRES ALBOMA"><img src="ADRES KARTINKI" width="160" height="180" style="margin:1px 0 0 4px;"></a> </td> </tr> </table> <p>
Таблица для вставки альбомов с размерами auto: Rosetta Tarot	</p> <table border="3" cellspacing="5" cellspacing="5" style="float: right; margin: 0 5px 2px 0; width:auto;"> <CAPTION ALIGN=BOTTOM><b>NAZVANIE ALBOMA</b></CAPTION></p> <tr> <td align="center" style="height:auto;background:url(http://picasaweb.google.com/s/c/transparent_album_background.gif) no-repeat left"> <a href="ADRES ALBOMA"><img src="ADRES KARTINKI" width="190" height="auto" style="margin:1px 0 0 4px;"></a> </td> </tr> </table> <p>

.

</p> <table width="auto" border="5" cellpadding="3"> <tr> <th>ВНИМАНИЕ: ИНТЕЛЛЕКТУАЛЬНАЯ СОБСТВЕННОСТЬ!</th> </tr> <tr> <td><center>Содержимое страницы защищено авторскими правами. Любое копирование, частичное или полное воспроизведение текста страницы возможно только при указании автора <a href="https://lizi-black.com/">© Lizi_Black</a></center></td> </tr> </table> <p>

Добавить ?nohtml=1 в конец адреса страницы. Это выведет все посты в ленте в виде html кода
.