bga68 (bga68) wrote,
bga68
bga68

HTML. Примеры для LiveJournal

HTML. Примеры для LiveJournal

Не секрет, что LiveJournal понимает не все команды (Tag/Tags), которые есть в HTML.
Но кое-что можно использовать :

ok-hand <img src="http://www.mediafire.com/convkey/3456/xkospwi994bjdw9zg.jpg?size_id=2" alt="ok-hand" width="35" />
либо
< <span style="font-family: &# 39;Wingdings 2&# 39;; font-size: 20pt;">&# 60;</span>

⚠️ - знак внимания

<link rel="shortcut icon" href="https://ic.pics.livejournal.com/bga68/68022014/1192182/1192182_original.png" type="image/png">

ZiS logo<img src="http://www.mediafire.com/convkey/0948/39npou2abw9xob2zg.jpg?size_id=6" alt="ZiS logo" width="120" align="middle" />
<img src="https://www.mediafire.com/convkey/8927/3eb4zuqazlt5qfqzg.jpg?size_id=c" title="ZiS logo-red1" width="60" align="middle" />
GAZ logo 1932 <img src="http://www.mediafire.com/convkey/3e40/m0nc4a24xq17br4zg.jpg?size_id=4" alt="GAZ logo 1932" width="110" />
GAZ logo 1960 / 5 зубцов - после 1981 <img src="http://www.mediafire.com/convkey/30fb/ippdvrr63b2fodyzg.jpg?size_id=5" alt="GAZ logo 1960 / 5 зубцов - после 1981" width="100" />
ZiL logo <img src="http://www.mediafire.com/convkey/416d/xgm5z6smhypu2eizg.jpg?size_id=7" alt="ZiL logo" width="120" />
ZiL logo-gif <img src="http://www.mediafire.com/convkey/2031/8w0hns41uvj1cnkzg.jpg?size_id=2" alt="ZiL logo поздняя" width="120" />
КрАЗ эмблема <img src="http://www.mediafire.com/convkey/f9dd/ffxpmqtr4w3ipnozg.jpg?size_id=3" alt="КрАЗ эмблема" width="120" />
МАЗ 500 эмблема <img src="http://www.mediafire.com/convkey/bc58/qnk4ijb3nki188rzg.jpg?size_id=5" alt="МАЗ-500 эмблема" width="100" />
МАЗ 200 эмблема <img src="http://www.mediafire.com/convkey/ff90/te1v8irzj5d3ga9zg.jpg?size_id=3" alt="МАЗ-200 эмблема" style="float: bottom; vertical-align: middle; margin-top: 0; /* Отступ сверху */ margin-right: 10px; width: 100px;" />

<iframe src="http://docs.google.com/viewer?url=http://maz.by/media/14356/каталог-шасси-евро5.pdf&embedded=true" width="700" height="520"
style="border: none;"></iframe>



****


.ру/Ководство
Основные темы «Ководства» — графический и промышленный дизайн, проектирование интерфейсов, типографика, семиотика и визуализация.

Предисловие расположено внизу. Проект существует с 1997 года. Автор — Артемий Лебедев. https://www.artlebedev.ru/kovodstvo/sections/


Как создать сайт. Некоторые тонкости


Текст, отцентрированный по середине картинки:
<span style="font-size: 1.4em;"><img alt="004" src="http://www.mediafire.com/convkey/1dd7/ysg3g4wd5rshpu4zg.jpg?size_id=3" style="float: bottom; vertical-align: middle; margin-top: 0; /* Отступ сверху */ margin-right: 10px; " title="Microsoft Exchange Server 2019" width="35" /> Microsoft Exchange Server 2019</span>

Пример текста, отцентрированного по середине картинки:
004 Microsoft Exchange Server 2019

/* ключевые значения */
vertical-align: baseline;
vertical-align: sub;
vertical-align: super;
vertical-align: text-top;
vertical-align: text-bottom;
vertical-align: middle;
vertical-align: top;
vertical-align: bottom;

/* значения длины (< length >) */
vertical-align: 10em;
vertical-align: 4px;

/* процентные значения (< percentage >) */
vertical-align: 20%;

/* глобальные значения */
vertical-align: inherit;
vertical-align: initial;
vertical-align: unset;



Facebook:
<figure class="aentry-post__figure aentry-post__figure--media"><div class="fb-post" data-href="https://www.facebook.com/kochetkov.vladimir/posts/1075139016174699" data-width="500"><div class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/kochetkov.vladimir/posts/1075139016174699">Facebook post</a></div></div></figure>



<figure><div style="width: 500px; padding: 20px; border-radius: 16px;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
border-bottom-right-radius: 16px;
border-bottom-left-radius: 16px; border-style: solid; border-width: 1px; border-color: # 922704; text-align: justify; "><a target="_blank" href="https://www.securitylab.ru/blog/personal/offtopic/"><img style="max-width: 50px;
border-top-left-radius: 50%;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-bottom-left-radius: 50%; padding: 10px;" src="http://www.mediafire.com/convkey/86e1/fmocj2xwg8x5tlezg.jpg?size_id=2" alt="Сергей Гордейчик" align="left" /> <span style="font-size: 1em">Сергей Гордейчик</span></a>
<span style="font-size: 1.4em; ">Черно-белая «статика» или динамический анализ исходных кодов</span>

Краткое содержание: как модно искать уязвимости приложений; почему SAST и статический анализ, и DAST и динамический анализ не синонимы; в чем
</div></figure>

Сергей Гордейчик Сергей Гордейчик
Черно-белая «статика» или динамический анализ исходных кодов

Краткое содержание: как модно искать уязвимости приложений; почему SAST и статический анализ, и DAST и динамический анализ не синонимы; в чем

Смайлик: <img src="http://ic.pics.livejournal.com/bga68/68022014/488927/488927_original.jpg" alt="" title="" width="17" style="float: bottom; margin-top: 0; /* Отступ сверху */
margin-bottom: -5px; /* Отступ снизу */" >
Глазик: <img src="http://zabaka.ru/images/eye.png" width="20" align="middle" />
👋 <span style="font-size: 2.2em; color: red;"> 👋 </span>
Иконка сторонних ресурсов:
   <img src="http://ic.pics.livejournal.com/bga68/68022014/316506/316506_original.jpg" alt="" title="Сторонние ресурсы" width="20" >

Отступы:

<p style="text-indent: 2em;">

indent = 2em


Висячая строка:

<div style="margin-left: 60px; text-indent: -60px;"><span style="color: # 875757; font-weight: bold;">Программист</span>: ну представь, что ты писатель и поддерживаешь проект “Война и мир”. </div>

Программист: ну представь, что ты писатель и поддерживаешь проект “Война и мир”.



padding: 5px 10px 25px 10px;

Разрешается использовать одно, два, три или четыре значения, разделяя их между собой пробелом. Эффект зависит от количества значений
Число значений
Результат
1
Поля будут установлены одновременно от каждого края элемента.
2
Первое значение устанавливает поля от верхнего и нижнего края, второе — от левого и правого.
3
Первое значение задает поле от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.
4
Поочередно устанавливается поля от верхнего, правого, нижнего и левого края.



Толщина рамки вокруг рисунка:
style="border-style: solid; border-width: 1px; border-color: # 2c8fd1;"
style="border-style: solid; border-width: 1px; border-color: # ebb35f;"


Примечание:
Прим.: Следует удалять предыдущие версии Office, развернутые по технологии установщика Windows (MSI) перед установкой Office 2019

Код примечания:
<div id="prim" style="margin-left: 30px;"><i>Прим.: Следует удалять предыдущие версии <b>Office</b>, развернутые по технологии <b>установщика Windows</b> (<b>MSI</b>) перед установкой <b>Office 2019</b></i></div>


2-й вариант примечания:

IMPORTANT: Starting with Windows 10 October 2018 Update, RSAT is included as a set of «Features on Demand» in Windows 10 itself.

Код 2-го варианта примечания:

<div class="warning_box" style="box-sizing: border-box; background-color: rgb(247, 245, 245); border-left: 3px solid rgb(157, 156, 156); padding: 18px 26px; margin-bottom: 18px; color: rgb(51, 51, 51); font-family: Roboto, sans-serif;">IMPORTANT: Starting with Windows 10 October 2018 Update, RSAT is included as a set of «Features on Demand» in Windows 10 itself.</div>

3-й вариант примечания:

style="background-color: rgba(0,101,179,0.3);              background-color: # 0065B3;
background-color: rgb(226,218,241);             
background-color: # 922704;             
border-radius: 6px;
     border-top-left-radius: 6px;
     border-top-right-radius: 6px;
     border-bottom-right-radius: 6px;
     border-bottom-left-radius: 6px;

Код 3-го варианта примечания:

<div style="border-radius: 16px; background-color: rgba(224,242,255,0.8); padding: 10px; margin-left: 10px; "> <span style="font-size: 1.4em">&# 9432;</span> <b>Важно!</b>
<div style="margin-left: 25px; margin-right: 10px; text-align: justify;">Так как активация выполняется через Интернет, Office 365 профессиональный плюс не работает на компьютерах, которые никогда не подключаются к Интернету. На таких компьютерах целесообразно установить набор Office профессиональный плюс 2019, для активации которого можно воспользоваться одним из <a href="https://docs.microsoft.com/DeployOffice/vlactivation/plan-volume-activation-of-office" target="_blank">традиционных методов</a>, например службой управления ключами (KMS) или ключом многократной активации (MAK).</div></div>

Пример примечания, вариант 3:

Важно!
Так как активация выполняется через Интернет, Office 365 профессиональный плюс не работает на компьютерах, которые никогда не подключаются к Интернету. На таких компьютерах целесообразно установить набор Office профессиональный плюс 2019, для активации которого можно воспользоваться одним из традиционных методов, например службой управления ключами (KMS) или ключом многократной активации (MAK).

div style="background-color: rgba(255,98,0,0.3);"
a style="color: rgb(255, 255, 255); text-decoration-line: none;":

Важно!
Так как активация выполняется через Интернет, Office 365 профессиональный плюс не работает на компьютерах, которые никогда не подключаются к Интернету. На таких компьютерах целесообразно установить набор Office профессиональный плюс 2019, для активации которого можно воспользоваться одним из традиционных методов, например службой управления ключами (KMS) или ключом многократной активации (MAK).



Выбор шрифта: <span style="font-family: Verdana, Arial, Helvetica, sans-serif;"> Текст </span>


Пример командной строки:

<Add OfficeClientEdition="64" Channel="Monthly" Version="-1" ForceUpgrade="TRUE">
 

Код командной строки:
<center><div style="border-style: solid; border-width: 1px; border-color: # ff0000; background-color: # f0f0f0;">
<Add OfficeClientEdition="64" Channel="Monthly" <span style="color: # ff6200;">Version="-1"</span> ForceUpgrade="TRUE">
 
</div></center>


2-й вариант командной строки:

С помощью следующей команды можно проверить, установлены ли компоненты RSAT в вашем компьютере:

Get-WindowsCapability -Name RSAT* -Online

<code style="box-sizing: border-box; font-family: Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 12.6px; padding: 2px 4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">et-WindowsCapability -Name RSAT* -Online</code>

Интересные примеры на странице рекламы форума 3D SOLIDWORKS RUSSIA 2018 – Dassault Systèmes®


Ссылку на чат можно давать всем: https://join.skype.com/gdX3XuJGHdQe - юмор для тех, кому хочется поднять себе настроение.

 
Совет: У многих скайп запущен на телефоне и каждое сообщение пиликает, как смс-ка. Раздражает Чтобы отключить в этом чате уведомления о сообщениях, введите команду в поле сообщений: /alertsoff Действует для этого чата. И начальство не будет удивляться пиликанью телефона


<a href="https://join.skype.com/eDpDd3HY8lyk" target="_blank"><img src="http://ic.pics.livejournal.com/bga68/68022014/920907/920907_original.gif" alt="" title="" width="25" align="middle"></a> Ссылку на чат можно давать всем: <a href="https://join.skype.com/gdX3XuJGHdQe" target="_blank">https://join.skype.com/gdX3XuJGHdQe </a> - юмор для тех, кому хочется поднять себе настроение.
<p> 
<i>Совет: У многих скайп запущен на телефоне и каждое сообщение пиликает, как смс-ка. Раздражает <img src="http://ic.pics.livejournal.com/bga68/68022014/488927/488927_original.jpg" alt="" title="" width="17" align="middle"> Чтобы отключить в этом чате уведомления о сообщениях, введите команду в поле сообщений: <b>/alertsoff</b> Действует для этого чата. И начальство не будет удивляться пиликанью телефона <img src="http://ic.pics.livejournal.com/bga68/68022014/488927/488927_original.jpg" alt="" title="" width="17" align="middle"> </i>


Абзацный отступ / Табуляция: <span style="margin-left: 50px;"> Текст </span>

Символ: • список
Символ: ◦ список
Список: <ol><li> нумерация цифрами </li></ol>
Список: <ol><ul> маркированный список </ul> </ol>
Список: <li value="4"> Список, который начинается, например, с цифры 4 </li>
Список:
  1. <li style="list-style-type: square;">Маркер в виде квадрата </li>
  2. <li style="list-style-type: upper-roman;">Римские числа в верхнем регистре (I, II, III, IV, V,...).</li>
  3. <li style="list-style-type: lower-alpha;">Строчные латинские буквы (a, b, c, d,...).</li>
  4. <li style="list-style-type: lower-greek;">Строчные греческие буквы (α, β, γ, δ,...).</li>



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

line-height: множитель | значение | проценты | normal | inherit

normal - Расстояние между строк вычисляется автоматически.
inherit - Наследует значение родителя

span style="line-height: 0.7em;"

Параметры текста: overflow-wrap: break-word; text-align: justify;
http://htmlbook.ru/css/word-wrap



<lj-like buttons="repost,facebook,twitter,vkontakte,google,odnoklassniki,tumblr,pocket,livejournal" />

Рамка вокруг рисунка: style="border-style: dotted;"
border-style:none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

Расстояние от края рисунка до текста: hspace=" "


Ширина рисунка: width=" "
Для тега style ширина рисунка style="max-width: 300px;"

Обтекание рисунка текстом: align="left" align="justify" align="right"

Центрирование текста или рисунка: <center> Текст </center>


Гиперссылка без подчеркивания и цвета # 0078d7:

style="text-decoration-line: none; color: # 0078d7;"

style="text-decoration-line: none; color: rgb(24, 100, 155);" - срабатывает только тогда, когда style применяется к тегу ссылки (<a href="..."> </a>)


Цвет background для текста: style="color: red; background-color: # dbd7d7;"

Пример красного шрифта на сером фоне


<code style="color: black; background-color: # d7d7d7;">& nbsp;      Set-MsolDirSyncEnabled -EnableDirSync $false & nbsp;     </code>

       Set-MsolDirSyncEnabled -EnableDirSync $false      

Таблица

<table style="border-collapse: collapse;>

Устанавливает, как отображать границы вокруг ячеек таблицы. Это свойство играет роль, когда для ячеек установлена рамка, тогда в месте стыка ячеек получится линия двойной толщины (рис. 1а). Значение collapse заставляет браузер анализировать подобные места в таблице и убирать в ней двойные линии (рис. 1б). При этом между ячейками остается только одна граница, одновременно принадлежащая обеим ячейкам. То же правило соблюдается и для внешних границ, когда вокруг самой таблицы добавляется рамка.
а
б

Рис. 1. Вид таблицы при использовании свойства border-collapse



Свойство border-spacing - устанавливает расстояние между границами ячеек (для table)

<table style="border-color:# cccccc; border-style: solid; border-width: 1px; border-spacing: 0;">
<tr style="background-color: # 737373;">
<td style="padding: 5px;"><span style="color: # ffffff;">Автор: Elie Bursztein </span>
</td>
</tr>
</table>

Пример:
Автор: Elie Bursztein



Свойство word-break указывает, как делать перенос строк внутри слов, которые не помещаются по ширине в заданную область. http://htmlbook.ru/css/word-break

Синтаксис
word-break: normal | break-all | keep-all

Значения
normal
Используются правила переноса строк по умолчанию. Как правило, в этом случае строки не переносятся или переносятся в тех местах, где явно задан перенос (например, с помощью тега <br>).
break-all
Перенос строк добавляется автоматически, чтобы слово поместилось в заданную ширину блока. Значение не работает для текста на китайском, корейском или японском языке.
keep-all
Не разрешает перенос строк в словах на китайском, корейском или японском языке. Для остальных языков действует как normal.

<li style="overflow-wrap: break-word; ">

См.: http://htmlbook.ru/css/word-wrap



<td style="padding: 5px; border: 1px solid rgb(155, 160, 166); white-space: nowrap;">Модель:</td> - устанавливает серую границу ячейки rgb(155, 160, 166) и удаляет лишние пробелы white-space между словами
Пример:

<span style="padding: 5px; border: 1px solid rgb(155, 160, 166); white-space: nowrap;">Модель: автомобиль в масштабе 1:43</span>

Пример:

Модель: автомобиль в масштабе 1:43


Для TD
padding: 5px; /* Поля вокруг текста */ Поочередно устанавливается поля от верхнего, правого, нижнего и левого края / border-color:# dbd7d7; border-style: solid; border-width: 1px;


<p onmouseover="this.style.color = 'red'"
onmouseout="this.style.color = ''">
Наведи мышь, и текст покраснеет, а потом почернеет снова</p>

Пример:


Наведи мышь, и текст покраснеет, а потом почернеет снова




Вариант 2:
<span style="p.example:hover { color: red; };">

<p class="example">Наведи мышь, и текст покраснеет, а потом почернеет снова</p></span>

Пример:
Наведи мышь, и текст покраснеет, а потом почернеет снова

Источник: http://html-plus.in.ua/obrabotka-sobytiy-onmouseover-i-onmouseout/


Смайлики:

🙂 смайлик 🙂 -> &# 128578; / цвет смайлика поменять нельзя!

&# 9786; смайлик цвет # F29D1D; размер style="font-size: 2.0em; color: rgb(242,157,29); font-weight: 900;"

&# 9785; грустный смайлик цвет # ff6200, размер style="font-size: 1.4em"

&# 9787; - черный смайлик. Цвет:
&# 9784; - паутинка
&# 9786;
&# 9787;
&# 9784;
&♯ 9839 MUSIC SHARP SIGN

#&# 35; NUMBER SIGN
#&# x23; NUMBER SIGN


horizontal tab &# 9; - &# 9; / не работает
CR &# 13; 000D carriage return - возврат каретки

Спецсимволы:

✩ &# 10025; https://www.toptal.com/designers/htmlarrows/symbols/
⚙ &# 9881;
✬ &# 10028;
✭ &# 10029;
✮ &# 10030;
✯ &# 10031;
★ & starf; &# 9733;
☆ & star; &# 9734;
@ & commat;
℃ &# 8451;
℉ &# 8457;
℗ & copysr;
℠ &# 8480;
ℼ &# 8508;
⅀ &# 8512;
☀ &# 9728;
☁ &# 9729;
☂ &# 9730;
☉ &# 9737;
☊ &# 9738;
☋ &# 9739;

☎ & phone; &# 9742;
☏ &# 9743;
☑ &# 9745;
☒ &# 9746;
☘ &# 9752;
☠ &# 9760;
☢ &# 9762;
☣ &# 9763;
☤ &# 9764;
☪ &# 9770;
☭ &# 9773;
☮ &# 9774;
☯ &# 9775;
☰ &# 9776;
☷ &# 9783;
☺ &# 9786;
☸ &# 9784;
☻ &# 9787;
☾ &# 9790;
♀ & female; &# 9792;
♁ &# 9793;
♂ & male; &# 9794;


♔ &# 9812;
♕ &# 9813;
♖ &# 9814;
♗ &# 9815;
♘ &# 9816;
♙ &# 9817;
♚ &# 9818;
♛ &# 9819;
♜ &# 9820;
♝ &# 9821;
♞ &# 9822;
♟ &# 9823;
♠ &# 9824; & spades;
♡ &# 9825;
♢ &# 9826;
♣ &# 9827; & clubs;
♤ &# 9828;
♥ &# 9829; & hearts;
♦ &# 9830; & diams;
♧ &# 9831;
♩ &# 9833; QUARTER NOTE
♪ &# 9834; & sung; EIGHTH NOTE
♫ &# 9835; BEAMED EIGHTH NOTES
♬ &# 9836; BEAMED SIXTEENTH NOTES
♭ &# 9837; & flat; MUSIC FLAT SIGN
♮ &# 9838; & natural; MUSIC NATURAL SIGN
♯ &# 9839; & sharp; MUSIC SHARP SIGN


♲ &# 9842; UNIVERSAL RECYCLING SYMBOL

♳ &# 9843; RECYCLING SYMBOL FOR TYPE-1 PLASTICS

♴ &# 9844; RECYCLING SYMBOL FOR TYPE-2 PLASTICS

♵ &# 9845; RECYCLING SYMBOL FOR TYPE-3 PLASTICS

♶ &# 9846; RECYCLING SYMBOL FOR TYPE-4 PLASTICS

♷ &# 9847; RECYCLING SYMBOL FOR TYPE-5 PLASTICS

♸ &# 9848; RECYCLING SYMBOL FOR TYPE-6 PLASTICS

♹ &# 9849; RECYCLING SYMBOL FOR TYPE-7 PLASTICS

♺ &# 9850; RECYCLING SYMBOL FOR GENERIC MATERIALS

♻ &# 9851; BLACK UNIVERSAL RECYCLING SYMBOL

♼ &# 9852; RECYCLED PAPER SYMBOL

♽ &# 9853; PARTIALLY-RECYCLED PAPER SYMBOL

♾ &# 9854; PERMANENT PAPER SIGN

⚀ &# 9856; DIE FACE-1

⚃ &# 9859; DIE FACE-4

⚄ &# 9860; DIE FACE-5

⚅ &# 9861; DIE FACE-6

⚐ &# 9872; WHITE FLAG

⚑ &# 9873; BLACK FLAG

⚒ &# 9874; HAMMER AND PICK

⚔ &# 9876; CROSSED SWORDS

⚕ &# 9877; STAFF OF AESCULAPIUS

⚖ &# 9878; SCALES

⚚ &# 9882; STAFF OF HERMES

⚛ &# 9883; ATOM SYMBOL

⚜ &# 9884; FLEUR-DE-LIS

⚝ &# 9885; OUTLINED WHITE STAR

⚠ &# 9888; WARNING SIGN

⚢ &# 9890; DOUBLED FEMALE SIGN

⚣ &# 9891; DOUBLED MALE SIGN

⚤ &# 9892; INTERLOCKED FEMALE AND MALE SIGN

⚥ &# 9893; MALE AND FEMALE SIGN

⚦ &# 9894; MALE WITH STROKE SIGN

⚧ &# 9895; MALE WITH STROKE AND MALE AND FEMALE SIGN

⚨ &# 9896; VERTICAL MALE WITH STROKE SIGN

⚩ &# 9897; HORIZONTAL MALE WITH STROKE SIGN

✁ &# 9985; UPPER BLADE SCISSORS

✂ &# 9986; BLACK SCISSORS

✃ &# 9987; LOWER BLADE SCISSORS

✄ &# 9988; WHITE SCISSORS

✆ &# 9990; TELEPHONE LOCATION SIGN

✇ &# 9991; TAPE DRIVE

✈ &# 9992; AIRPLANE

✉ &# 9993; ENVELOPE

✎ &# 9998; LOWER RIGHT PENCIL

✏ &# 9999; PENCIL

✐ &# 10000; UPPER RIGHT PENCIL

✑ &# 10001; WHITE NIB

✒ &# 10002; BLACK NIB

✓ &# 10003; & check; CHECK MARK

✔ &# 10004; HEAVY CHECK MARK

✕ &# 10005; MULTIPLICATION X

✖ &# 10006; HEAVY MULTIPLICATION X

✗ &# 10007; & cross; BALLOT X

✘ &# 10008; HEAVY BALLOT X


✠ &# 10016; & malt; MALTESE CROSS

✡ &# 10017; STAR OF DAVID

✢ &# 10018; FOUR TEARDROP-SPOKED ASTERISK

✣ &# 10019; FOUR BALLOON-SPOKED ASTERISK

✤ &# 10020; HEAVY FOUR BALLOON-SPOKED ASTERISK

✥ &# 10021; FOUR CLUB-SPOKED ASTERISK

✦ &# 10022; BLACK FOUR POINTED STAR

✧ &# 10023; WHITE FOUR POINTED STAR

✩ &# 10025; STRESS OUTLINED WHITE STAR

✪ &# 10026; CIRCLED WHITE STAR

✫ &# 10027; OPEN CENTRE BLACK STAR

✬ &# 10028; BLACK CENTRE WHITE STAR

✭ &# 10029; OUTLINED BLACK STAR

✮ &# 10030; HEAVY OUTLINED BLACK STAR

✯ &# 10031; PINWHEEL STAR

✰ &# 10032; SHADOWED WHITE STAR

✴ &# 10036; EIGHT POINTED BLACK STAR

✵ &# 10037; EIGHT POINTED PINWHEEL STAR

✶ &# 10038; & sext; SIX POINTED BLACK STAR

✷ &# 10039; EIGHT POINTED RECTILINEAR BLACK STAR

✸ &# 10040; HEAVY EIGHT POINTED RECTILINEAR BLACK STAR

✹ &# 10041; TWELVE POINTED BLACK STAR

✺ &# 10042; SIXTEEN POINTED ASTERISK

✻ &# 10043; TEARDROP-SPOKED ASTERISK

✼ &# 10044; OPEN CENTRE TEARDROP-SPOKED ASTERISK

✽ &# 10045; HEAVY TEARDROP-SPOKED ASTERISK

✾ &# 10046; SIX PETALLED BLACK AND WHITE FLORETTE

✿ &# 10047; BLACK FLORETTE

❀ &# 10048; WHITE FLORETTE

❁ &# 10049; EIGHT PETALLED OUTLINED BLACK FLORETTE

❂ &# 10050; CIRCLED OPEN CENTRE EIGHT POINTED STAR

❃ &# 10051; HEAVY TEARDROP-SPOKED PINWHEEL ASTERISK

❄ &# 10052; SNOWFLAKE

❅ &# 10053; TIGHT TRIFOLIATE SNOWFLAKE

❆ &# 10054; HEAVY CHEVRON SNOWFLAKE

❇ &# 10055; SPARKLE

❈ &# 10056; HEAVY SPARKLE

❉ &# 10057; BALLOON-SPOKED ASTERISK

❊ &# 10058; EIGHT TEARDROP-SPOKED PROPELLER ASTERISK

❋ &# 10059; HEAVY EIGHT TEARDROP-SPOKED PROPELLER ASTERISK

❍ &# 10061; SHADOWED WHITE CIRCLE

❏ &# 10063; LOWER RIGHT DROP-SHADOWED WHITE SQUARE

❐ &# 10064; UPPER RIGHT DROP-SHADOWED WHITE SQUARE

❑ &# 10065; LOWER RIGHT SHADOWED WHITE SQUARE

❒ &# 10066; UPPER RIGHT SHADOWED WHITE SQUARE

❖ &# 10070; BLACK DIAMOND MINUS WHITE X

❘ &# 10072; & VerticalSeparator; LIGHT VERTICAL BAR

❙ &# 10073; MEDIUM VERTICAL BAR

❚ &# 10074; HEAVY VERTICAL BAR

❛ &# 10075; HEAVY SINGLE TURNED COMMA QUOTATION MARK ORNAMENT

❜ &# 10076; HEAVY SINGLE COMMA QUOTATION MARK ORNAMENT

❝ &# 10077; HEAVY DOUBLE TURNED COMMA QUOTATION MARK ORNAMENT

❞ &# 10078; HEAVY DOUBLE COMMA QUOTATION MARK ORNAMENT

❡ &# 10081; CURVED STEM PARAGRAPH SIGN ORNAMENT

❢ &# 10082; HEAVY EXCLAMATION MARK ORNAMENT

❣ &# 10083; HEAVY HEART EXCLAMATION MARK ORNAMENT

❤ &# 10084; HEAVY BLACK HEART

❥ &# 10085; ROTATED HEAVY BLACK HEART BULLET

❦ &# 10086; FLORAL HEART

❧ &# 10087; ROTATED FLORAL HEART BULLET

❴ &# 10100; MEDIUM LEFT CURLY BRACKET ORNAMENT

❵ &# 10101; MEDIUM RIGHT CURLY BRACKET ORNAMENT


❶ &# 10102; DINGBAT NEGATIVE CIRCLED DIGIT ONE

❷ &# 10103; DINGBAT NEGATIVE CIRCLED DIGIT TWO

❸ &# 10104; DINGBAT NEGATIVE CIRCLED DIGIT THREE

❹ &# 10105; DINGBAT NEGATIVE CIRCLED DIGIT FOUR

❺ &# 10106; DINGBAT NEGATIVE CIRCLED DIGIT FIVE

❻ &# 10107; DINGBAT NEGATIVE CIRCLED DIGIT SIX

❼ &# 10108; DINGBAT NEGATIVE CIRCLED DIGIT SEVEN

❽ &# 10109; DINGBAT NEGATIVE CIRCLED DIGIT EIGHT

❾ &# 10110; DINGBAT NEGATIVE CIRCLED DIGIT NINE

❿ &# 10111; DINGBAT NEGATIVE CIRCLED NUMBER TEN

➀ &# 10112; DINGBAT CIRCLED SANS-SERIF DIGIT ONE

➁ &# 10113; DINGBAT CIRCLED SANS-SERIF DIGIT TWO

➂ &# 10114; DINGBAT CIRCLED SANS-SERIF DIGIT THREE

➃ &# 10115; DINGBAT CIRCLED SANS-SERIF DIGIT FOUR

➄ &# 10116; DINGBAT CIRCLED SANS-SERIF DIGIT FIVE

➅ &# 10117; DINGBAT CIRCLED SANS-SERIF DIGIT SIX

➆ &# 10118; DINGBAT CIRCLED SANS-SERIF DIGIT SEVEN

➇ &# 10119; DINGBAT CIRCLED SANS-SERIF DIGIT EIGHT

➈ &# 10120; DINGBAT CIRCLED SANS-SERIF DIGIT NINE

➉ &# 10121; DINGBAT CIRCLED SANS-SERIF NUMBER TEN

➊ &# 10122; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT ONE

➋ &# 10123; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT TWO

➌ &# 10124; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT THREE

➍ &# 10125; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT FOUR

➎ &# 10126; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT FIVE

➏ ➏ DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT SIX

➐ &# 10128; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT SEVEN

➑ &# 10129; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT EIGHT

➒ &# 10130; DINGBAT NEGATIVE CIRCLED SANS-SERIF DIGIT NINE

➓ &# 10131; DINGBAT NEGATIVE CIRCLED SANS-SERIF NUMBER TEN

£ &# 163; & pound; POUND SIGN

€ &# 8364; & euro; EURO SIGN


÷ &# 247; & divide; DIVISION SIGN

≠ &# 8800; & ne; NOT EQUAL TO SIGN

¼ &# 188; & frac14; FRACTION ONE QUARTER

½ &# 189; & frac12; FRACTION ONE HALF

¾ &# 190; & frac34; FRACTION THREE QUARTERS

⅓ &# 8531; & frac13; VULGAR FRACTION ONE THIRD

⅔ &# 8532; & frac23; VULGAR FRACTION TWO THIRDS

⅛ &# 8539; & frac18; VULGAR FRACTION ONE EIGHTH

⅜ &# 8540; & frac38; VULGAR FRACTION THREE EIGHTHS

⅝ &# 8541; & frac58; VULGAR FRACTION FIVE EIGHTHS

µ &# 181; & micro; MICRO SIGN

⁂ &# 8258; ASTERISM

⁕ &# 8277; FLOWER PUNCTUATION MARK

∮ &# 8750; & conint; CONTOUR INTEGRAL

∲ &# 8754; & cwconint; CLOCKWISE CONTOUR INTEGRAL

∳ &# 8755; & awconint; ANTICLOCKWISE CONTOUR INTEGRAL

≤ &# 8804; & le; LESS-THAN OR EQUAL TO

≥ &# 8805; & ge; GREATER-THAN OR EQUAL TO

⊗ &# 8855; & otimes; CIRCLED TIMES

⁰ &# 8304; SUPERSCRIPT ZERO


© Copyright Sign - © / & copy; © - &# 169;
® Registered Sign - ® / & reg; ® - &# 174; -> https://www.w3schools.com/charsets/ref_utf_latin1_supplement.asp
± Plus-Minus Sign - ± / & plusmn;
÷ Division Sign
™ Trade Mark Sign - ™ / &# 153; либо ™ - & trade;
℠ Service Mark ℠ - &# 8480;
℗ Sound Recording Copyright - ℗ / &# 8471;
Ø диаметр - & Oslash;
₴ Hryvnia Sign
á Latin Small Letter A With Acute
Á Latin Capital Letter A With Acute

° Degree Sign - & deg;
℃ DEGREE CELSIUS - &# 8451;
℉ DEGREE FAHRENHEIT - &# 8457;
{ Left Curly Bracket
} Right Curly Bracket
~ Tilde
@ Commercial At
% Percent Sign
& Ampersand
€ Euro Sign - € / & euro;
● black circle либо • & bull; либо • / &# 149;
- &# 8227; TRIANGULAR BULLET
◌ Dotted Circle
STAR OPERATOR - &# 8902;
DIVISION TIMES - &# 8903;
DIAMOND OPERATOR - &# 8900;
BLACK SUN WITH RAYS - &# 9728; ->
UMBRELLA - &# 9730; ->
BLACK STAR - &# 9733; ->
WHITE STAR - &# 9734; ->
HAMMER AND SICKLE - &# 9773; ->
PEACE SYMBOL - &# 9774;
YIN YANG - &# 9775; ->
WHITE FLAG - &# 9872; ->
BLACK FLAG - &# 9873; ->
PENTAGRAM - &# 9956; ->
RIGHT-HANDED INTERLACED PENTAGRAM - &# 9957; ->
LEFT-HANDED INTERLACED PENTAGRAM - &# 9958; ->
INVERTED PENTAGRAM - &# 9959; ->
🕸 🕸 - &# 128376; -> 🕸
- &# 9993; ->
🚹 🚹 - &# 128697; -> 🚹
🚺 🚺 - &# 128698; -> 🚺
🚻 🚻 - &# 128699; -> 🚻
🚼 🚼 - &# 128700; -> 🚼
- &# 9432; -> - Латинская строчная буква i в круге
🛈🛈 - &# 128712; -> 🛈 - Информация (знак в круге)
① Circled Digit One
≈ Almost Equal To
≠ Not Equal To
⅓ Vulgar Fraction One Third
⅔ Vulgar Fraction Two Third
○ white circle
◦ white bullet
▪ Black Small Square
▫ White Small Square

HTML tags https://www.w3schools.com/charsets/ref_utf_arrows.asp  
https://www.w3schools.com/charsets/ref_utf_arrows.asp:
← ← ← LEFTWARDS ARROW - &# 8592; / & larr;
↑ ↑ ↑ UPWARDS ARROW - &# 8593; / & uarr;
→ → → RIGHTWARDS ARROW - &# 8594; / & rarr;
↓ ↓ ↓ DOWNWARDS ARROW - &# 8595; / & darr;
↔ ↔ ↔ LEFT RIGHT ARROW - &# 8596; / & harr;
↕ ↕ UP DOWN ARROW - &# 8597;
↖ ↖ NORTH WEST ARROW - &# 8598;
↗ ↗ NORTH EAST ARROW - &# 8599;
↘ ↘ SOUTH EAST ARROW - &# 8600;
↙ ↙ SOUTH WEST ARROW - &# 8601;


Внедрение видео с YouTube:
<lj-embed id="4"> - порядковый номер id выставляет автоматически сам LiveJournal
<iframe width="560" height="315" src="https://www.youtube.com/embed/XVfOe5mFbAE?wmode=opaque" frameborder="0" allowfullscreen="allowfullscreen"</iframe>
</lj-embed>

Внедрение видео с Facebook:
<object width="400" height="224"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://www.facebook.com/v/!!!!!!!!!!!!!!!" /><embed src="http://www.facebook.com/v/!!!!!!!!!!!!!!!!!!!" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="400" height="224"></embed></object>


Выравнивание рисунка относительно текста: align="middle"

Кат LJ: <lj-cut> Текст </lj-cut>


Внедрение видео swf:

<lj-embed id="6">
<object type="application/x-shockwave-flash" width="624" height="500" id="swfViewer" data="http://multimedia.cars.com/evox/exterior/5609_ex036_640.swf">
<param name="movie" value="http://multimedia.cars.com/evox/exterior/5609_ex036_640.swf">
</object>
</lj-embed>

Вариант кода 2:



<object id="flashcontent"
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
width="550px"
height="400px">
<param name="movie" value="mymovie.swf" />

<!--[if !IE]>-->
<object type="application/x-shockwave-flash"
data="mymovie.swf"
width="550px"
height="400px">
<!--<![endif]-->

<p>
Fallback or 'alternate' content goes here.
This content will only be visible if the SWF fails to load.
</p>

<!--[if !IE]>-->
</object>
<!--<![endif]-->

</object>

Верхний индекс: <sup> Текст </sup>

Нижний индекс: <sub> Текст </sub>

Цитата: <blockquote> Текст </blockquote>

Тег <code> предназначен для отображения одной или нескольких строк текста, который представляет собой программный код.

Открывающий знак <: & l t ;

Закрывающий знак >: & g t ;

Открывающие кавычки &# 8220;: & # 8220;
Закрывающие кавычки &# 8221;: & # 8221;

Знак ®

<del>PGD67-JN23K-JGVWV-KTHP4-GXR9G</del>
PGD67-JN23K-JGVWV-KTHP4-GXR9G

Пример:
<!DOCTYPE html>
<html>
<head>
<style>
a.one:link {color:# ff0000;}
a.one:visited {color:# 0000ff;}
a.one:hover {color:# ffcc00;}

a.two:link {color:# ff0000;}
a.two:visited {color:# 0000ff;}
a.two:hover {font-size:150%;}

a.three:link {color:# ff0000;}
a.three:visited {color:# 0000ff;}
a.three:hover {background:# 66ff66;}

a.four:link {color:# ff0000;}
a.four:visited {color:# 0000ff;}
a.four:hover {font-family:monospace;}

a.five:link {color:# ff0000;text-decoration:none;}
a.five:visited {color:# 0000ff;text-decoration:none;}
a.five:hover {text-decoration:underline;}
</style>
</head>

<body>
<p>Mouse over the links and watch them change layout:

<p><b><a class="one" href="default.asp" target="_blank">This link changes color</a></b>
<p><b><a class="two" href="default.asp" target="_blank">This link changes font-size</a></b>
<p><b><a class="three" href="default.asp" target="_blank">This link changes background-color</a></b>
<p><b><a class="four" href="default.asp" target="_blank">This link changes font-family</a></b>
<p><b><a class="five" href="default.asp" target="_blank">This link changes text-decoration</a></b>
</body>
</html>

Справочник по HTML http://htmlbook.ru/html
HTML tags https://www.w3schools.com/charsets/ref_utf_arrows.asp
HTML School https://zarabotat-na-sajte.ru/uroki-html/teg-img.html
Справочник по HTML http://www.w3schools.com/tags/tag_code.asp
Спецсимволы в HTML http://htmlbook.ru/samhtml/tekst/spetssimvoly
ШРИФТЫ
font-size http://htmlbook.ru/css/font-size
font-weight: bold|bolder|lighter|normal|100|200|300|400|500|600|700|800|900 http://htmlbook.ru/css/font-weight
overflow: auto | hidden | scroll | visible | inherit http://htmlbook.ru/css/overflow

Названия цветов http://htmlbook.ru/html/value/colorname
Таблица «безопасных» цветов https://www.artlebedev.ru/colors/

Обработка событий onmouseover и onmouseout http://html-plus.in.ua/obrabotka-sobytiy-onmouseover-i-onmouseout/

Скруглённые уголки http://htmlbook.ru/css3-na-primerakh/skruglennye-ugolki
Значения стилевых свойств http://htmlbook.ru/samcss/znacheniya-stilevykh-svoystv
Как добавить иконку сайта в адресную строку браузера? http://htmlbook.ru/faq/kak-dobavit-ikonku-sayta-v-adresnuyu-stroku-brauzera
Как растянуть фон на всю ширину окна? http://htmlbook.ru/faq/kak-rastyanut-fon-na-vsyu-shirinu-okna
Как сделать обтекание картинки текстом? http://htmlbook.ru/faq/kak-sdelat-obtekanie-kartinki-tekstom
Как добавить фоновый рисунок на веб-страницу? http://htmlbook.ru/faq/kak-dobavit-fonovyy-risunok-na-veb-stranitsu
Как разместить элементы списка горизонтально? http://htmlbook.ru/faq/kak-razmestit-elementy-spiska-gorizontalno
Как выровнять фотографию по центру веб-страницы? http://htmlbook.ru/faq/kak-vyrovnyat-fotografiyu-po-tsentru-veb-stranitsy
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши? http://htmlbook.ru/faq/kak-sdelat-chtoby-kartinka-menyalas-pri-navedenii-na-nee
background-position http://htmlbook.ru/css/background-position

Обрезка картинок:
http://www.diary.ru/~diary-tips/p190133826.htm?oam#more2
https://artkiev.com/blog/css-image-crop-resize.htm
https://html5book.ru/kak-obrezat-yelement/

Изображения, которое служит в качестве маркера списка: http://htmlbook.ru/css/list-style-image
CSS list-style-image size https://stackoverflow.com/questions/7775594/css-list-style-image-size


Бесплатные иконки 700+ иконок для сайтов на Tilda.cc https://tilda.cc/ru/free-icons/ - Создайте впечатляющий сайт на Tilda для бизнеса и медиа https://tilda.cc/ru/
 
 

Мой личный блог оценили в
30100 евро
А сколько стоит твой?

Tags: html, html5, tags
Subscribe

Recent Posts from This Journal

  • Post a new comment

    Error

    default userpic

    Your IP address will be recorded 

    When you submit the form an invisible reCAPTCHA check will be performed.
    You must follow the Privacy Policy and Google Terms of use.
  • 0 comments