Как добавить с помощью свойств CSS перенос строки. Разрыв строки в HTML: используем тег br Перенос на следующую строку

Описание

Свойство white-space устанавливает, как отображать пробелы между словами. В обычных условиях любое количество пробелов в коде HTML показывается на веб-странице как один. Исключением является тег
Помещенный в этот контейнер текст выводится со всеми пробелами, как он был отформатирован
 пользователем. Таким образом, white-space
 имитирует
 работу тега Но в отличие от него не меняет шрифт
 на моноширинный.
Синтаксис
white-space: normal | nowrap | pre | pre-line | pre-wrap | inherit
Значения
 normal
 Текст в окне браузера выводится как обычно, переносы строк устанавливаются
 автоматически.
 nowrap
 Пробелы не учитываются, переносы строк в коде HTML игнорируются, весь текст отображается одной строкой;
 вместе с тем, добавление тега 

 переносит текст
 на новую строку.
 pre
 Текст показывается с учетом всех пробелов и переносов, как они были добавлены
 разработчиком в коде HTML.
 Если строка получается слишком длинной и не помещается в окне браузера, то будет добавлена горизонтальная полоса прокрутки.
 pre-line
 В тексте пробелы не учитываются, текст автоматически переносится на следующую строку, если он не помещается в заданную область.
 pre-wrap
 В тексте сохраняются все пробелы и переносы, однако если строка по ширине не помещается в заданную область, то текст автоматически будет перенесен на следующую строку.
 inherit
 Наследует значение родителя.
Действие значений на текст представлено в табл. 1.
HTML5
CSS2.1
IE
Cr
Op
Sa
Fx

 

 
 
 white-space
 
 
 
 
Пример
 
 
 
 Великая теорема Ферма

 X ⁿ
 + Y ⁿ =
 Z ⁿ

 где n - целое число > 2
 
 
 
 

Результат данного примера показан на рис. 1.
Рис. 1. Применение свойства white-space
Объектная модель
document.getElementById("elementID
").style.whiteSpace
Браузеры
Браузер Internet Explorer до версии 7.0 включительно не поддерживает значения pre-line
, pre-wrap
 и inherit
. Для </p>
<p>Opera до версии 9.5 не поддерживает значение pre-line
. Для <textarea>
 значения normal
 и pre
 ведут себя как pre-wrap
, а значение nowrap
 ведет себя как pre-line
.</p>
<p>Safari до версии 3.0 и iOS не поддерживают значения pre-wrap
 и pre-line
.</p>
<p>Firefox до версии 2.0 включительно не поддерживает значения pre-line
 и pre-wrap
. Для <textarea>
 значения normal
, nowrap
, и pre
 воспринимаются как pre-wrap
.</p>
<p>Урок 5.

 </p><h1></h1>
 <p>В этом уроке мы:<br>1. Узнаем как сделать чтобы html код был для нас более удобен и легко читаем.<br>2. Разберем как правильно делать перенос текстовой строки.</p>
 <h2>Делаем html код удобным.</h2>
 <p>Сейчас наш код понятен и легко читаем, так как в нем мало текста и практически нет тегов. Когда мы создадим более сложную страницу, то там будет много тегов, соответственно найти нужный будет сложно.</p>
 <p>Чтобы не было каши из тегов, нужно изначально расставлять теги и строки так, чтобы они визуально воспринимались легче. Когда браузер считывает информацию с html страницы, ему без разницы сколько пробелов и сколько пустых строк в коде.</p>
 <p>Я изменил текст в коде страницы относительно той, которую мы создавали, но это не важно. На левом и на правом рисунке изображен один и тот же код. Оба варианта будут отображаться браузером на экране монитора абсолютно одинаково. Согласитесь, работать с кодом изображенным справа будет гораздо легче, чем с тем, что слева.</p>
 <p>Рассматриваемый нами код очень простой, но даже сейчас заметна разница в визуальном восприятии. Каких-либо определенных правил "наведения порядка" нет, каждый мастер сам решает как ему удобнее работать.</p>
 <h2>Перенос строки html. Тег <br>.</h2>
 <p>Обратите внимание на рисунок. В первом варианте текст написан в одну строку, во втором варианте в две строки.</p>
 <br><img src='https://i2.wp.com/htmlboss.ru/image/lesson6-2.jpg' width="100%" loading=lazy><p>Браузер будет отображать оба варианта одинаково. Текст будет написан в одну строку:</p>
 <br><img src='https://i2.wp.com/htmlboss.ru/image/lesson6-3.jpg' width="100%" loading=lazy><p>Вы спросите, почему так? Ведь в одном из кодов часть текста перенесена на другую строку. Было бы логично если бы в браузере часть текста тоже перенеслась на другую строку, но у html своя логика в этом отношении. <u>Если мы в html коде делаем перенос строки, то для браузера это равнозначно одному пробелу
</u> (как обычный пробел между словами в тексте). Если мы перенесем часть текста не на одну строку вниз, а на 2 или 3 (любое количество), то браузер все равно будет считать это расстояние за один обычный пробел между словами и при выводе на экран текст будет писаться в одну строку.</p>
 <h3>Тег <br></h3>
 <p>Когда мы в третьем уроке знакомились с тегами, я упомянул, что бывают теги которые не требуют закрытия. Тег <b><br>
</b> один из них, служит он для переноса строки.<br> Давайте применим его в коде:</p>
 <img src='https://i0.wp.com/htmlboss.ru/image/lesson6-4.jpg' height="298" width="388" loading=lazy><p>Мы вставили тег <b><br>
</b> в наш html код и теперь при запуске файла через браузер часть текста будет перенесена на следующую стоку. <br> * <i>Не забываем сохранять изменения в Notepad (Ctrl + S) и обнавлять страницу в браузере (F5).
</i></p>
<p>Часто возникает потребность добавить новый абзац, но без пустой строки, которую вставляет тег абзаца <p>Для некоторых фрагментов текста принятые для абзацев стандартные интервалы просто неуместны. Это могут быть надписи под картинками и в таблицах, стихи, цитаты, сноски и примечания.</p><p>Для принудительного переноса строк предусмотрен специальный тег, функция которого заложена в его названии br (break row - "разорвать ряд, строку"). Тег <br> языка гипертекстовой разметки html означает, что все следующее за ним содержимое должно начинаться с новой строки. Если нужно, можно проставить несколько тегов подряд, чтобы добиться необходимого интервала.</p><p>Тег <br> не чувствителен к регистру и не требует закрывающего тега, потому что это пустой элемент, но лучше привыкать закрывать все теги. В XHTML тег разрыва должен быть "наглухо закрыт" на обратный слэш.</p><h2>Пример использования тега разрыва</h2><p><meta http-equiv="Content-Type"></p><p><META HTTP-EQUIV="Content-Type" CONTENT="text/html; windows-1251"></p><p><title >Тег br в действии < /title></p><p><р> Прогул на службе </р></p><p><p>Еще нигде и никогда <br></p><p>Я не был столь плохим <br></p><p>Начальства алчная орда <br></p><p>Грызет меня живым </р></p><p>Прогул на службе</p><p>Еще нигде и никогда<br>Я не был столь плохим.<br>Начальства алчная орда<br>Грызет меня живым.</p><h2>Атрибут тега <br></h2><p>Единственный атрибут, которым обладает html тег <br>, называется Он указывает браузеру, как поступить с переносимой строкой, если тексту придется обтекать так называемый плавающий элемент, каковым может быть, например, изображение с атрибутом выравнивания align, использующим значения right/left, или блок в CSS, которому прописано свойство float.</p><p>В спецификациях по XHTML 1.0 / HTML 4.01 атрибут clear можно использовать только с Transitional, Frameset и <!DOCTYPE>, иначе код будет нерабочим.</p><h2>Свойства атрибута тега </h2><p>Эффект от применения атрибута clear зависит от его значения и расположения обтекаемого текстом плавающего элемента. Атрибут может принимать 4 значения:</p><p><br clear = "right | left | all | none"></p><p><img src='https://i2.wp.com/fb.ru/misc/i/gallery/21147/458111.jpg' width="100%" loading=lazy></p><p>Значение left запрещает обтекание элемента, выровненного по левому краю, поэтому текст, "споткнувшись" о тег <br>, расположится ниже изображения или иного плавающего элемента.</p><p>Точно такой результат получится от использования аргумента all, который ни за что не позволит ни справа, ни слева.</p><p>Значение right запрещает тексту обтекание элемента, выровненного по правому краю, поэтому после тега <br> тексту не останется ничего другого, как обойти изображение, обтекая его справа.</p><p>Значение none ("ни вашим, ни нашим") вообще снимает все полномочия с атрибута clear, и тег <br> молча переносит строку вниз.</p><p>Значение по умолчанию, как таковое, у атрибута clear тега отсутствует.</p><h2>Тег <br> - это мягкий перенос</h2><p>Тег разрыва строки очень удобен для создания необходимых интервалов между абзацами, внутри которых он используется как мягкий перенос, но не как средство для деления текста на абзацы.</p><p><img src='https://i1.wp.com/fb.ru/misc/i/gallery/21147/458084.jpg' width="100%" loading=lazy></p><p>Не следует слишком увлекаться тегом перевода строк для форматирования текста, потому что результаты его применения не всегда отличаются изяществом.</p><p>Например, если использовать тег <br> для перевода строк внутри абзаца, это может привести к появлению "гребенки" в окне пользователя, если оно меньше окна, на которое ориентировался веб-мастер.</p>
<p>Здравствуйте, уважаемые читатели блога сайт! Те, кто хотя бы поверхностно успел ознакомиться с , наверное, уже приняли к сведению, пусть и в общих чертах. А значит, имеют представление о том, какие вообще HTML символы используются в коде документа.</p>
<p>В сегодняшней статье мы попробуем разобраться, что из себя представляет пробел в HTML, в каких случаях можно применить пробельные символы при форматировании самого кода для удобного восприятия. Узнаем, когда необходимо применение неразрывного пробела, а также познакомимся с другими спецсимволами (или, как их еще называют, мнемониками).</p>
<p>На самом деле я бы посоветовал не игнорировать тему использования различных спец символов, поскольку это важная составляющая, позволяющая придать законченность изучению языка гипертекстовой разметки. В общем, предоставленная в этой публикации информация лишней точно не будет. Ну а теперь к делу.</p>
<h2>Пробелы и пробельные символы в HTML</h2>
<p>Сначала необходимо сделать важное замечание. На клавиатуре компьютера есть специальные клавиши, которые позволяют реализовать разделение текста (чуть подробнее об этом ниже). Однако, лишь широкая клавиша пробела обеспечивает раздел между словами не только в редакторе, но и в окне браузера. При переносе строк и отступе от края существуют нюансы.</p>
<p>Как вы знаете, отображение тех или иных элементов в веббраузере определяется тегами. Для форматирования текста применяется известный , который является блочным. То есть его содержание располагается по всей доступной ширине.</p>
<p>Чтобы <b>перенести строки внутри абзаца P
</b>, нужно воспользоваться одиночным тегом BR, с помощью которого это можно осуществить. Скажем, нам нужно вставить в текст какие-нибудь строчки из стихотворения, которые мы пишем в текстовом редакторе:</p>
<p><img src='https://i1.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_131634.png' align="center" height="86" width="291" loading=lazy></p>
<p>Несмотря на то, что строки стиха расположены корректно и переносы осуществлены в нужных местах, в браузере все будет выглядеть иначе:</p>
<p><br><img src='https://i2.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_132107.png' align="center" width="100%" loading=lazy></p>
<p>Чтобы добиться такого же отображения в окне веб-обозревателя, нужно в каждом месте переноса строки прописать BR:</p>
<p><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_132552.png' align="center" height="85" width="300" loading=lazy></p>
<p>Теперь мы достигли выполнения поставленной задачи и в браузере стихотворные строчки отобразятся совершенно правильно:</p>
<p><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_132847.png' height="106" width="240" loading=lazy></p>
<p>Таким образом, нужные переносы строк выполнены. Здесь еще нужно отметить такую особенность, что множественные пробелы, идущие один за другим, веббраузер отображает как один. В этом вы сможете убедиться, если в том же редакторе попробуете поставить не один, а несколько пробелов между двумя словами и, нажав на кнопку «Сохранить», посмотрите на результат в браузере.</p>
<h3>Пробел, табуляция и перенос строки</h3>
<p>В принципе, с этими <b>пробельными символами
</b> мы знакомимся сразу же, как начинаем работу с текстом в редакторе и форматируем его в нужном виде. Для реализации подобной задачи существуют специальные клавиши, каждая из которых соответствует своему пробельному символу:</p>
<ul><li>Пробел - самая широкая клавиша на клавиатуре компьютера (без надписи);</li>
<li>Табуляция - клавиша слева с надписью «Tab» и двумя стрелками, направленными в разные стороны;</li>
<li>Перенос строки - клавиша «Enter».</li>
</ul><p>Однако, как я сказал выше, конечный нужный результат не только в текстовом редакторе, но и в браузере, мы получаем лишь при использовании первой клавиши. Все три клавиши (в том числе табуляция и перенос строки полезно использовать при форматировании кода HTML. Допустим, вот как выглядит фрагмент кода в NotePad++ ( об этом редакторе толковый материал) при отображении всех пробельных символов:</p>
<p><br><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_150813.png' align="center" width="100%" loading=lazy></p>
<p>Мы получаем код, который легко читаем и понятен благодаря пробелам. Оранжевыми стрелками отмечены отступы, создаваемые с помощью клавиши Tab, а символами CR и LF переносы строк, осуществляемые посредством кавиши Enter.</p>
<p>Просматриваются контейнеры, вложенные один в другой, хорошо выделяются открывающие и закрывающие теги. В таком виде данный код можно спокойно редактировать. А теперь сравните его с таким же кодом, в котором нет подобного разделения текста:</p>
<p>Таким же образом с помощью пробельных символов можно прописать и правила CSS, которые будут визуально выглядеть понятными и удобоваримыми:</p>
<p><br><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-19_164341.png' align="center" width="100%" loading=lazy></p>
<p>После того, как вы приведете все стили к общему знаменателю и полностью закончите редактирования файла стилей, можно будет подвергнуть , удалив из кода все пробелы. Это необходимо для повышения , что очень важно при продвижении ресурса.</p>
<h2>Спецсимволы (или мнемоники) в коде HTML</h2>
<p>Теперь разберем, в каких случаях необходимо использование специальных символов, о которых я упомянул в начале статьи. Спецсимволы HTML, которые иногда называют мнемониками, введены для решения давней проблемы с кодировками, возникшей в языке гипертекстовой разметки.</p>
<p>При наборе вами текста с клавиатуры происходит кодировка символов языка, который вы используете. В веббраузере набранный текст будет отображен посредством выбранных вами шрифтов в результате обратной операции декодирования.</p>
<p>Дело в том, что подобных кодировок немало, сейчас у нас нет цели их подробно разобрать. Просто в каждой из них может не доставать тех или иных символов, которые, однако, необходимо отобразить. Скажем, приспичило вам прописать одиночные кавычки или знак ударения, а эти значки банально отсутствуют в наборе.</p>
<p>Для того, чтобы ликвидировать эту проблему, и была введена система спецсимволов, которая включает в себя огромное количество самых различных мнемоник. Все они начинаются со значка амперсанда «&» и заканчиваются обычно точкой с запятой «;». Поначалу каждому спецсимволу соответствовал свой цифровой код. Например, для неразрывного пробела, который рассмотрим чуть ниже подробнее, будет справедлива такая запись:</p>
<p>Но спустя некоторое время наиболее распространенным символам были присвоены буквенные аналоги (мнемоники), чтобы их было проще запомнить. Скажем, для того же неразрывного пробела это выглядит следующим образом:</p>
<p>В результате браузер отображает соответствующий символ. Список мнемоник очень объемный, <b>наиболее часто применяемые спецсимволы HTML
</b> вы можете обнаружить из ниже следующей таблицы:</p>
<table><tbody><tr><th>символ
</th>
<th>код
</th>
<th>мнемоника
</th>
<th>описание
</th>
</tr><tr><td>
</td>
<td>
</td>
<td>
</td>
<td>неразрывный пробел
</td>
</tr><tr><td> 

</td>
<td> 
</td>
<td> 
</td>
<td>узкий пробел (еn-шириной в букву n)
</td>
</tr><tr><td> 

</td>
<td> 
</td>
<td> 
</td>
<td>широкий пробел (em-шириной в букву m)
</td>
</tr><tr><td>–
</td>
<td>-
</td>
<td>–
</td>
<td>узкое тире (en-тире)
</td>
</tr><tr><td>-
</td>
<td>—
</td>
<td>—
</td>
<td>широкое тире (em -тире)
</td>
</tr><tr><td>
</td>
<td>-
</td>
<td>
</td>
<td>мягкий перенос
</td>
</tr><tr><td>а́
</td>
<td>
</td>
<td>́
</td>
<td>ударение, ставится после "ударной" буквы
</td>
</tr><tr><th colspan="4">
</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><tr><td>ª
</td>
<td>ª
</td>
<td>ª
</td>
<td>зеркало Венеры
</td>
</tr><tr><td>‰
</td>
<td>‰
</td>
<td>‰
</td>
<td>промилле
</td>
</tr><tr><td style="font-size:23pt;font-family:Times New Roman,serif;">π
</td>
<td>π
</td>
<td>π
</td>
<td>пи (используйте Times New Roman)
</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><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><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><tr><th colspan="4">знаки арифметических и математических операций
</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><tr><td>±
</td>
<td>±
</td>
<td>±
</td>
<td>плюс/минус
</td>
</tr><tr><td>¹
</td>
<td>¹
</td>
<td>¹
</td>
<td>степень 1
</td>
</tr><tr><td>²
</td>
<td>²
</td>
<td>²
</td>
<td>степень 2
</td>
</tr><tr><td>³
</td>
<td>³
</td>
<td>³
</td>
<td>степень 3
</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><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><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><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><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><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><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><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><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><tr><td>∩
</td>
<td>∩
</td>
<td>∩
</td>
<td>пересечение
</td>
</tr><tr><td>∪
</td>
<td>∪
</td>
<td>∪
</td>
<td>объединение
</td>
</tr><tr><th colspan="4">знаки валют
</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>¤t;
</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><th colspan="4">маркеры
</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><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><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><tr><td>✐
</td>
<td>
</td>
<td>✐
</td>
<td>карандаш
</td>
</tr><tr><td>✍
</td>
<td>
</td>
<td>✍
</td>
<td>рука
</td>
</tr><tr><th colspan="4">кавычки
</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><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><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><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><tr><td>❝
</td>
<td>
</td>
<td>❝
</td>
<td>двойная английская кавычка открывающая
</td>
</tr><tr><td>❞
</td>
<td>
</td>
<td>❞
</td>
<td>двойная английская кавычка закрывающая
</td>
</tr><tr><th colspan="4">стрелки
</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><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><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><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><tr><td>◄
</td>
<td>
</td>
<td>◄
</td>
<td>треугольная стрелка влево
</td>
</tr><tr><th colspan="4">звездочки, снежинки
</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><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><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><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><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><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><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><tr><td>⊛
</td>
<td>
</td>
<td>⊛
</td>
<td>Снежинка в круге
</td>
</tr><tr><th colspan="4">часы, время
</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></tbody></table><h3>Случаи использования некоторых спецсимволов, в том числе неразрывного пробела и мягкого переноса</h3>
<p>Если вы немного уже изучили таблицу, то получили подтверждение сказанным мною выше словам, что для отображения всех спецсимволов используется цифровой код () либо его буквенный аналог (символьная мнемоника), где вместо совокупности решетки и цифр прописаны буквы ().</p>
<p>Теперь посмотрим, когда необходимо применять данные коды. Скажем, в статье вам необходимо в информативных целях указать какой-нибудь HTML тег, например, <footer>. Если набрать угловые скобки с клавиатуры (а такая возможность есть), то браузер воспримет такую конструкцию как открывающий тег, а не как простой фрагмент текста.</p>
<p>Поэтому из той же таблицы спецсимволов HTML берем соответствующие коды и вся запись будет выглядеть так:</p>
<p>Кроме того, чтобы отобразить в браузере не сам знак амперсанда, а его обозначение в <b>виде <footer>
</b>, нужно добавить из таблицы его код:</p><p>
 &lt;footer&gt;
</p><p>Тогда в браузере выведется именно запись мнемоник, которые нужно применить для отображения тега FOOTER. Немного путано, но на этой странице вы сможете попрактиковаться в данном аспекте, введя в поле «HTML» мнемоники для соответствующих символов и задействуя кнопку «Run», а в области «Result» получая результат их отображения в браузере:</p>
<p><br><img src='https://i1.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-20_190128.png' align="center" width="100%" loading=lazy></p>
<p>Обратите внимание, что я обеспечил перенос текста с помощью уже упомянутого тега BR с тем, чтобы сами символы отображались не в одну строку, а столбиком для удобства.</p>
<p>Идем дальше. Иногда в тексте возникают сочетания, которые нежелательно разделять по разным строкам. Скажем, «1000 руб.» будет логичным или оставить на верхней строке, или при недостатке места всю конструкцию перенести на на строку ниже.</p>
<p>Особенно это актуально, если пользователи применяют устройства с различной шириной экрана, в том числе мобильные. Ведь в этом случае веббраузер форматирует текст, подстраиваясь под новые условия. И если при стандартных размерах монитора текст выглядит корректно, то при их изменении все может поменяться.</p>
<p>Для этих случаев предусмотрен <b>неразрывный пробел HTML
</b>, о котором я уже упоминал. Напомню, что в этом случае код пробела такой:</p>
<p>И его нужно вставить между двумя совокупностями знаков, которые требуется связать:</p><p>1000 руб.
</p><p>Теперь браузер ни в коем случае не осуществит их разделение, даже если потребуется форматирование текста для его корректного отображения.</p>
<p>Также бывает такая ситуация, когда очень длинное слово не помещается в свободное пространство и требуется перенести его часть. Как при необходимости предопределить перенос на новую строку в этом случае? Для этого есть <b>спецсимвол мягкого переноса
</b> -, который нужно поместить в то место, в котором слово нужно разорвать:</p><p>Длинноедлинноедлинноедлинноедлинноеслово
</p><p>Если возникает ситуация, когда слово нужно перенести, то на месте нахождения мнемоники мягкого переноса образуется разрыв, где появится знак переноса (дефис), а оставшаяся часть данного слова окажется на ниже следующей строке.</p>
<p>Впрочем, опять же будет полезным все это дело, включая примеры неразрывного и мягкого переноса, воочию отследить на практике :</p>
<p><br><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2015/09/2015-09-20_200925.png' align="center" width="100%" loading=lazy></p>
<p>В окне этого редактора можно изменять размеры поля просмотра «Result», захватив левой кнопкой мышки край этой области и, не отпуская ее, тянуть влево для уменьшения ширины. Тогда возникает реальная ситуация, когда браузер начинает переформатировать содержимое для корректного его отображения.</p>
<p>И осуществляется перенос, который был предусмотрен в описанных мной примерах. Впрочем, вы сами можете подвигать просмотровое окно, расширяя-сужая ее, и визуально убедиться в этом.</p>
<p>Если я правильно поняла, то <div> и <br> имеют разные типы. <div> - контейнер блочного типа, а <br> больше похож на строчный, так? Хотя <br> вообще не похож на контейнер, и это сбивает меня с толку. Вопрос такой: если абзац определяется и форматируется с помощью тега <div>, например:</p>
<p><div class="justify">Текст, текст, много текста...</div></p>
<p>а после абзаца мне захотелось добавить пустую строку, то куда вставить <br>: внуть контейнера <div>:</p>
<p><div class="justify">Текст, текст, много текста...<br></div></p>
<p>или после закрывающего дескриптора </div>:</p>
<p><div class="justify">Текст, текст, много текста...</div><br></p>
<p>Результат у меня в броузере, вроде бы, один и тот же, но как правильно?<br>
Мне тут, конечно, пришло в голову, что можно не выпендриваться и отформатировать абзац с помощью тега <p>Результат будет как раз такой, как я хочу, но мне все-таки интересно узнать, куда же по правилам надо вставлять этот проклятый "бээр" и можно ли про него сказать, что он - контейнер строчного типа, а потому должен быть расположен внутри контейнера блочного типа, то есть <div>?</p>
<p>Перенесено в Стандарты.</p>
<p>По-моему без разницы...</p>
<p>Если внутри <div>, то значит перевод строки относится к нему.<br>
Если после, то значит перевод строки после <div>а...</p>
<p>Но я бы поставила после. Внутри имеет смысл ставить, если после написанного предложения следует еще одно с новой строки...</p>
<p>Берём источники, смотрим:<br>http://html.manual.ru/book/html/body/textblocks/br.php и<br>http://www.w3.org/TR/html4/struct/text.html#edef-BR</p>
<p> — не контейнер. Это элемент, который обеспечивает перевод текстовой строки и по большому счёту заменяет „родной“ перевод строки в тексте (ведь просто перевод строки, как известно, броузерами игнорируется и заменяется пробелом). Поэтому <br> для броузера является как бы обычным символом, и ничем иным, разве что за счёт атрибута clear ему даются некоторые дополнительные возможности.</p>
<p>Исходя из сказанного, думаю, понятно, что конструкция:<br>
<div><br>Он купил якитори на вертелах и две высокие вощеные картонки пива.<br>Бросив взгляд вверх, на голограммы, он обнаружил, что грудь одной из фигур уже заливает кровь. Густой коричневый соус стекал с вертелов и капал у Кейса с пальцев.</div><br>
совершенно правильна и очень жизнеспособна.</p>
<p>Замечание: не стоит использовать <div> для форматирования. для форматирования и оформления текста рекомендуется использовать <p>. <div> — структурный блок, который обычно предназначен для создания независимых друг от друга элементов страницы, которые иногда называются „слоями“. Также он обеспечивает более явное логическое структурирование (по крайней мере, предназначен для этого).<br>http://www.w3.org/TR/html4/struct/global.html#edef-DIV</p>
<p>Алексей совершенно прав, но я позволю себе добавить ещё немножко теории. Теория, конечно, не всегда идёт в ногу с практикой, но ведь Вас интересует именно теоретическая сторона вопроса? Так вот, элемент строчного типа <BR> - это всего лишь указание браузеру: "разорви или закончи здесь строку". Не больше. Используя конструкцию <BR></DIV> или </DIV><BR>, Вы пытаетесь применить этот тег с совсем другой целью, с целью, для которой он не предназначен. А именно, Вы пытаетесь использовать <BR> для создания пустой строки, или даже нет, не пустой строки, а <b>увеличенного промежутка между строками
</b>. Этот эффект, однако, является побочным, а потому полагаться на него - плохой стиль вёрстки. Таким образом, <b>обе конструкции
</b> по сути своей ошибочны! Теоретически, браузер должен проигнорировать тег <BR> в обоих позициях: в первой - потому, что закрывающий тег </DIV> сам по себе разрывает и заканчивает строку (а сколько раз можно разорвать или закончить одну и ту же строку?), во второй - потому, что после </DIV> строка вообще не определена. Но, как видно, браузеры очень часто отклоняются от предписаний стардартов... Если Вы хотите строго следовать стандартам, создавайте абзацы с помощью тегов <P>А межстрочные расстояния регулируйте с помощью CSS . Но конечно, практически следовать этой рекомендации трудно, а порой невозможно; но это уже другая тема.</p>
<p>Мама... Это что же такое получилось??? Господи, откуда все эти пустые строки??? :))<br>
Попробую еще раз... "Блокнот"пошаливает, извините, пожалуйста...</p>
<p>Кстати,мой броузер-таки на комбинацию...<br></div> не реагирует... (наверное, к стандартам подтягивается:)))</p>
<p>Но все-таки, как же добиться такой конструкции:</p>
<p><br><br>
 Прежде чем Кейсу удалось найти палатку, где торговали едой, пришлось сделать вокруг здания почти полный круг.<br><br></p>

<p>Если средний абзац форматировать с помощью контейнера <p>То перед ним будет пустая строка, которая мне не нужна. Для моего броузера кострукция <div>...</div><br> работает, но она неправильна:(Все, что я хочу - окружить средний абзац тегами <div> и </div>, а потом вставить пустую строку. Несколько странно, что после </div> строка вообще не определена:(Раз </div> разрывает и заканчивает строку, то весьма логично решить: одна строка закончилась, началась другая. И тут же разорвать ее с помощью <br>. (Это, естественно, претензии не к вам, уважаемые эксперты, день и ночь отвечающие на наши безумные вопросы:), а к HTML -ю и ко всем прочим... броузерам) Я, собственно, всю свою недолгую жизнь среди HTML не могла понять, чем отличаются <p>И <div>, и верила, что вот как раз этими лишними пустыми строками, то есть, добавлением их. Но вы меня убедили, что это не так:)<br>
Так значит, окружать, средний абзац , а потом как-то за счет межстрочного расстояния убирать лишнюю пустую строку, которая появляется в таком случае перед ним? Но как? Можно тогда поподробнее, на примере?</p>
<p>Я все-равно не понял, где этот "средний" абзац...<br>
Не пойму, в чем сложность вставить <br> в нужном месте? Между теми же или <div></div>...</p>
<p><!--// блок //--><br>
<div>" Кейс был очень, очень голоден. <br><br>
В таком состоянии он, казалось, мог бы проглотить слона. </div><br>
 <div style="text-indent: 30px">Прежде чем Кейсу удалось найти палатку, где торговали едой, пришлось сделать вокруг здания почти полный круг. <br><br>
Он купил якитори на вертелах и две высокие вощеные картонки пива. <br><br>
Бросив взгляд вверх, на голограммы, он обнаружил, что грудь одной из фигур уже заливает кровь. Густой коричневый соус стекал с вертелов и капал у Кейса с пальцев.</div></p>
<p><p style="text-indent: 30px">Но это зрелище оставило его безучастным. <br><br>
Он съел все до последнего кусочка и с удовольствием запил якитори пивом." </p><br>
<!--// //--></p>
<p>Первый абзац:<br>
Кейс был очень, очень голоден. <br>
В таком состоянии он, казалось, мог бы проглотить слона.</p>
<p>Второй абзац, он же средний:<br>
Прежде чем Кейсу удалось найти палатку, где торговали едой, пришлось сделать вокруг здания почти полный круг. <br>
Он купил якитори на вертелах и две высокие вощеные картонки пива. <br>
Бросив взгляд вверх, на голограммы, он обнаружил, что грудь одной из фигур уже заливает кровь. Густой коричневый соус стекал с вертелов и капал у Кейса с пальцев.</p>
<p>Третий:<br>
Но это зрелище оставило его безучастным. <br>
Он съел все до последнего кусочка и с удовольствием запил якитори пивом.</p>
<p>Дмитрий, Вы мне мою пустую строку обеспечиваете за счет того, что третий абзац в контейнер <p>Заключаете, ну а если это не удобно? Если абзацев в тексте много, а это проклятая пустая строка должна встретиться только один раз в указанном месте? (то есть, если третий абзац так оформлять, то когда он закончится, будет разрыв и пустая строка, а мне этого не нужно) К тому же вот граждане пишут, что вообще лучше <div> не использовать для форматирования, а Вы использовали...</p>
<p>С точки зрения теории (а в этом разделе мы говорим о теории, а о практике лишь постольку поскольку), так вот, с точки зрения теории в HTML пустых строк не бывает. Вообще! Строка - это комбинация линейно расположенных символов; нет символов - и строки не может быть. Поэтому-то аргумент</p>
<p>> Несколько странно, что после </div> строка вообще не<br>
> определена:(Раз </div> разрывает и заканчивает строку,<br>
> то весьма логично решить: одна строка закончилась,<br>
> началась другая. И тут же разорвать ее с помощью <br>.</p>
<p>неприемлем: нельзя разорвать несуществующую "пустую строку", нельзя разорвать то, чего нет. Чтобы строка всё-таки обрела существование, нужно вставить в неё хоть какой-нибудь символ. Если вставить, появится ощущение "пустой строки" и всё будет законно (хотя и нелогично). Алина, <b>теоретически
</b> Вам нужна не пустая строка - Вам нужно увеличенное расстояние между строками (интерлиньяж). Тег <P>В большинстве броузеров по умолчанию создаёт перед собой удвоенный относительно базового интерлиньяж. Если Вы хотите строго придерживаться теории и принципов логической разметки, абзацы следует создавать с помощью тега <P>С соответствующими стилями (margin-top для верхнего отступа, line-height для высоты строк внутри абзаца).</p>
<p>Но это теория. Большинство практиков используют <b>фактическое
</b> поведение браузеров, не вдаваясь в теоретические тонкости. Т. е. устанавливают удвоенный интерлиньяж с помощью комбинации <BR><BR> (хотя по закону второй <BR> должен игнорироваться), мешают <P>И <DIV> и всякими прочими способами добиваются <b>визуальных эффектов
</b>, опираясь на в принципе ошибочную интерпретацию браузерами языка <b>логической
</b> разметки HTML. И зачастую это оправдано - просто потому, что язык визуальной разметки CSS реализован в браузерах ещё хуже HTML, и полагаться на него очень часто нельзя...</p>
<p>Так... Вмешаюсь.<br>
Алина, если вы хотите, чтобы у вас всё выглядело так, как вам нужно — это одно. Если вам нужно, чтобы вёрстка следовала правилам и высокой логике HTML — это совсем другое. Более того, часто одно с другим не совпадает.</p>
<p>Теперь по делу. Если вам нужно, чтобы абзацев было много, а пробел был только в одном месте, вы вполне можете сложить весь текст в один [абзац <p>Слой <div> (нужное подчеркнуть)]. (см. мой первый пример с фрагментом из „Нейромансера“ У.Гибсона)<br>
Так абзац будет у вас только один (реально), но выглядеть вы можете его заставить по-всякому, за счёт <br>. В том месте, где вам нужен будет пустая строка, <br> будет стоять два раза подряд.<br>
Но это, как вы понимаете, нарушает логику HTML.</p>
<p>Идём дальше. У нас есть такая прекрасная вещь, как стилевое оформление документов, и определив для нашего абзаца margin:0px, мы получим именно то, что нужно — нулевой отступ между абзацами. (сразу прошу прощения за избыточный объём, но для наглядности мне пришлось использовать несколько абзацев. Скопируйте пример в html-страницу и просмотрите)</p>
<p><p style="margin:0px;">Прежде чем Кейсу удалось найти палатку, где торговали едой, пришлось сделать вокруг здания почти полный круг. Он купил якитори на вертелах и две высокие вощеные картонки пива. Бросив взгляд вверх, на голограммы, он обнаружил, что грудь одной из фигур уже заливает кровь. Густой коричневый соус стекал с вертелов и капал у Кейса с пальцев.</p> <br>
 <p>Башни ее и поля, разбросанные в бесцветном псевдопространстве<br>
симуляционной матрицы - всего лишь электронная видимость, облегчающая<br>
процесс управления и обмен огромными объемами данных. Законным<br>
программистам дела нет до тех стен из льда, позади которых они работают,<br>
стен тьмы, которые скрывают их операции от других - артистов<br>
индустриального шпионажа и деловых ребят вроде Бобби Квинна.</p><br>
 <p style="margin:0px;">Бобби был ковбоем. Он был хакером, вором-взломщиком, потрошившим<br>
разветвленную электронную нервную систему человечества. Он присваивал<br>
информацию и кредиты в переполненной матрице, монохромном<br>
псевдопространстве, где, как редкие звезды во тьме, светились плотные<br>
сгустки данных, мерцали галактики корпораций и отсвечивали холодным<br>
блеском спирали военных систем.</p><br>
 <p style="margin:0px;">Бобби был одним из тех потерявшихся во времени лиц, которых всегда<br>
застанешь за выпивкой в "Джентльмене-Неудачнике", популярном в городе<br>
баре, пристанище для электронных ковбоев, дельцов и прочих ребят, хоть<br>
каким-то боком связанных с кибернетикой.</p><br>
 <p style="margin:0px;">Мы были партнерами.</p></p>
<p>Замечание в тему: если использовать предыдущий, „неверный“ вариант, то отступ между строками иногда хочется сделать меньше или больше одного <br>. В этом случае используется распорка, которая и обеспечит иллюзию половинного или полуторного интервала.</p>
<p>Раз уж зашла речь о "теории", то замечу, что в подобная конструкция противоречит правилам русского языка (и не только русского). Поэтому, уподобляясь остальным “теоретикам” предложу: "Прежде чем думать о верстке, убедитесь, что это не протеворечит правилам "человеческого" языка". :)</p>
<p>Гениальная мысль - текст представить в виде графики.<br>
И все те проблемы будут решены.<br>
Другая мысль - попробовать в SVG.<br>
Третья - какого..... до сих пор никто не проработал управление переносами в словах?<br>
В CSS2 какое-то подобие заложили, да что толку....</p>
<p>Управление переносами крайне проблематично. Для автоматической расстановки переносов браузер должен знать правила грамматики соответствующего языка, что в функции браузера не входит и в принципе входить не должно. Остаются "мягкие" переносы, "зашитые" в сам текст. Для этого уже есть символ - , который, правда, пока не всеми браузерами понимается. О расстановке "мягких" переносов должен заботиться автор/редактор текста, или его можно поручить серверу, "знающему" правила расстановки переносов.</p>

<script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+
	escape(document.referrer)+((typeof(screen)=="undefined")?"":
	";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?
	screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+
	";"+Math.random()+
	"border='0' width='1' height='1' loading=lazy>");</script>
        <div class="crp_related ">
            <h3>Советуем почитать</h3>
            <ul>
                                     <li><a href="/cms/optimiziruem-rabotu-chrome-i-firefox-kak-uskorit-google-chrome-sovety-po.html"><img src="/uploads/316a66a84d173d77aa8807a3d0c14d5f.jpg" alt="Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц" title="Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц" width="150" height="150" class="crp_thumb crp_featured" loading=lazy><span class="crp_title">Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц</span></a></li>
                                     <li><a href="/joomla/sposoby-kotorye-pomogut-ubrat-reklamu-v-yandeks-brauzere.html"><img src="/uploads/d4f0ad12140b36a3a1e8e0f4a0496eb0.jpg" alt="Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс" title="Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс" width="150" height="150" class="crp_thumb crp_featured" loading=lazy><span class="crp_title">Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс</span></a></li>
                                     <li><a href="/htmlcss/sozdanie-3v-igr-luchshie-programmy-dlya-sozdaniya-igr-pochemu.html"><img src="/uploads/11c06c9f7a5c3ecb024ccfa8b2006fb2.jpg" alt="Лучшие программы для создания игр" title="Лучшие программы для создания игр" width="150" height="150" class="crp_thumb crp_featured" loading=lazy><span class="crp_title">Лучшие программы для создания игр</span></a></li>
                                     <li><a href="/htmlcss/programmy-chtoby-delat-igry-kak-sozdayut-igry-na-kompyuter-programmy-dlya-igr.html"><img src="/uploads/48334132745ba79926997ea945ffa97a.jpg" alt="Как создают игры на компьютер?" title="Как создают игры на компьютер?" width="150" height="150" class="crp_thumb crp_featured" loading=lazy><span class="crp_title">Как создают игры на компьютер?</span></a></li>
                



            </ul>
            <div class="crp_clear"></div>
        </div>
    </div>
    

    <script type="text/javascript" src="//yastatic.net/share/share.js" charset="utf-8"></script>
    <div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="button" data-yashareQuickServices="vkontakte,facebook,twitter,odnoklassniki,lj"></div><br>
</div>

	<div class="post-nav section">													
		<div class="prev-post"><i class="fa fa-angle-left"></i>
    <h4><a href="/html5/vybor-antivirusa-dlya-windows-10-vstroennyi-zashchitnik-windows.html" rel="prev">Встроенный Защитник Windows</a></h4>
</div>
<!-- /next_post -->	
		<div class="next-post">
    <h4><a href="/sozdanie-im/skachat-instagram-dlya-kompyutera-mobilnaya-versiya-kak-polzovatsya-prilozheniem-na-kompyutere-veb-i.html" rel="next">Как пользоваться приложением на компьютере?</a></h4><i class="fa fa-angle-right"></i></div>
<!-- /next_post -->	</div>
<center>




</center>
<br>
			<div class="related-posts">
			
			<h3>Похожие записи</h3>			
			<div class="post-list">
																					
					    <div class="one-half">

        <article class="post-4393 post type-post status-publish format-standard has-post-thumbnail hentry category-dom">

            <div class="thumb excerpt-thumb overlay">
                <a href="/sozdanie-im/kibersport-na-android-i-ios-v-kakie-igry-igrayut-mobilnye-kibersportsmeny.html"><img width="340" height="227" src="/uploads/89e3489f0a63058e6c23993c08fef62a.jpg" class="attachment-wt340_230 wp-post-image" alt="Киберспортивные дисциплины будущего Самые популярные игры киберспорта"  loading=lazy></a>
            </div>

            <div class="excerpt-wrap">

                <div class="entry-meta">
                    <span class="entry-cat-bg main-color-bg cat305-bg"><a href="/category/sozdanie-im/">Создание ИМ</a></span> <span class="date">2024-04-10 15:44:07</span>
                </div>

                <h3><a href="/sozdanie-im/kibersport-na-android-i-ios-v-kakie-igry-igrayut-mobilnye-kibersportsmeny.html">Киберспортивные дисциплины будущего Самые популярные игры киберспорта</a></h3>
                <p>В уходящем году вышло много интересных проектов, претендующих на звание "киберспортивная дисциплина". Telegram-канал "Мама, я геймер"...</p>

            </div>

        </article>
        
    </div>
<!-- /next_post -->
										
																	
					    <div class="one-half col-last">

        <article class="post-4392 post type-post status-publish format-standard has-post-thumbnail hentry category-dom">

            <div class="thumb excerpt-thumb overlay">
                <a href="/sozdanie-im/mail-bilyard-russkii-bilyard-mail-kratkaya-istoriya-bilyarda.html"><img width="340" height="227" src="/uploads/b2629bc5d5bc3d0ade1291dadb92b114.jpg" class="attachment-wt340_230 wp-post-image" alt="Маил бильярд. Русский бильярд майл. Краткая история бильярда"  loading=lazy></a>
            </div>

            <div class="excerpt-wrap">

                <div class="entry-meta">
                    <span class="entry-cat-bg main-color-bg cat305-bg"><a href="/category/sozdanie-im/">Создание ИМ</a></span> <span class="date">2024-04-10 15:44:07</span>
                </div>

                <h3><a href="/sozdanie-im/mail-bilyard-russkii-bilyard-mail-kratkaya-istoriya-bilyarda.html">Маил бильярд. Русский бильярд майл. Краткая история бильярда</a></h3>
                <p>Чтобы играть в бильярд на двоих с другом нужно время и хорошая компания, но онлайн Бильярд «Восьмёрка» (Ball Pool) лучше - можно...</p>

            </div>

        </article>
        
    </div>
<!-- /next_post -->
										
							</div>
			
		</div>		
		
	





				
			
</div>	

 


<div id="sidebar">
    <aside id="search-2" class="widget widget_search">
        <div class="widget-title">
            <div class="icon"></div>
            <h4>Поиск по сайту</h4>
        </div>
        <form method="get" id="searchform" action="/">
            <input type="text" class="searchfield" name="s" id="s" placeholder="Поиск" />
            <button class="search-submit button main-color-bg"><i class="fa fa-search"></i></button>
        </form>
    </aside>
    <aside id="text-38" class="widget widget_text">
        <div class="textwidget">
            

        </div>
    </aside>

    <aside id="wt_popular_tabs_widget-2" class="widget widget_tabs">
        <script>
            jQuery(document).ready(function($) {
                $(".widget-tab-titles li").click(function() {
                    $(".widget-tab-titles li").removeClass('active');
                    $(this).addClass("active");
                    $(".tab-content").hide();
                    var selected_tab = $(this).find("a").attr("href");
                    $(selected_tab).fadeIn();
                    return false;
                });
            });
        </script>

        <div class="widget-tabs-title-container">
            <ul class="widget-tab-titles list">
                <li class="active">
                    <h5><a href="#widget-tab1-content">Свежие</a></h5>
                </li>
                <li class="">
                    <h5><a href="#widget-tab2-content">Популярные</a></h5>
                </li>

            </ul>
        </div>
        <div class="tabs-content-container">

            <div id="widget-tab1-content" class="tab-content" style="display: block;">
                <ul class="list post-list">

                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/sozdanie-im/onlain-servisy-i-programmy-dlya-obedineniya-fotografii-v-odnu-dve.html"><img src="/uploads/e15e9458c3b27c90d61b665e3a30bea9.jpg" class="attachment-wt75_75 wp-post-image" alt="Две фотографии в одну Онлайн объединить 2 фотографии в 1"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/sozdanie-im/">Создание ИМ</a></span> <span class="date">2024-04-10 15:44:07</span>
                                    </div>
                                    <h3><a href="/sozdanie-im/onlain-servisy-i-programmy-dlya-obedineniya-fotografii-v-odnu-dve.html">Две фотографии в одну Онлайн объединить 2 фотографии в 1</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/cms/kody-na-gta-san-andreas-na-zimu-opisanie-i-ustanovka-chit-kody-na-grand-theft-auto-san.html"><img src="/uploads/bc8d6ff86f28bc40f9db7b57dcf1f718.jpg" class="attachment-wt75_75 wp-post-image" alt="Чит коды на Grand Theft Auto: San Andreas (PC) Работа с погодой и временем"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/cms/">Cms</a></span> <span class="date">2024-04-09 15:35:38</span>
                                    </div>
                                    <h3><a href="/cms/kody-na-gta-san-andreas-na-zimu-opisanie-i-ustanovka-chit-kody-na-grand-theft-auto-san.html">Чит коды на Grand Theft Auto: San Andreas (PC) Работа с погодой и временем</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/wordpress/skachat-dlya-skairim-mody-zacharovanie-bez-ogranichenii-dyrka-dlya.html"><img src="/uploads/af352478dcf4c208354e80e16dfc6afc.jpg" class="attachment-wt75_75 wp-post-image" alt="Дырка для создания вещей с бесконечными параметрами"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/wordpress/">Wordpress</a></span> <span class="date">2024-04-08 16:07:35</span>
                                    </div>
                                    <h3><a href="/wordpress/skachat-dlya-skairim-mody-zacharovanie-bez-ogranichenii-dyrka-dlya.html">Дырка для создания вещей с бесконечными параметрами</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/optimization/vybiraem-luchshii-brauzer-na-android-smartfonov-i-planshetov-kakoi-brauzer-dlya.html"><img src="/uploads/956e4533c77890fca5688402a2384a30.jpg" class="attachment-wt75_75 wp-post-image" alt="Какой браузер для Смарт ТВ выбрать?"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/optimization/">Оптимизация</a></span> <span class="date">2024-04-07 15:37:28</span>
                                    </div>
                                    <h3><a href="/optimization/vybiraem-luchshii-brauzer-na-android-smartfonov-i-planshetov-kakoi-brauzer-dlya.html">Какой браузер для Смарт ТВ выбрать?</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/sozdanie-im/domashnee-tv-bilain-lyubye-kanaly-kruglosutochno-i-v-luchshem-kachestve-na.html"><img src="/uploads/6cb5d5e0e46a3085d621ef9f70e2e611.jpg" class="attachment-wt75_75 wp-post-image" alt="Любые каналы круглосуточно и в лучшем качестве на компьютере – реальность Мобильное тв на компьютере"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/sozdanie-im/">Создание ИМ</a></span> <span class="date">2024-04-07 15:37:28</span>
                                    </div>
                                    <h3><a href="/sozdanie-im/domashnee-tv-bilain-lyubye-kanaly-kruglosutochno-i-v-luchshem-kachestve-na.html">Любые каналы круглосуточно и в лучшем качестве на компьютере – реальность Мобильное тв на компьютере</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/php/kak-samostoyatelno-obnaruzhit-spryatannyi-zhuchok-ili-proslushku-v.html"><img src="/uploads/8ab7d1a12d2cf54ba325147776af3c4a.jpg" class="attachment-wt75_75 wp-post-image" alt="Как самому изготовить детектор для обнаружения прослушки и жучков или глушилку-подавитель радиосигналов от жучков и прослушивающих гаджетов"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/php/">Php</a></span> <span class="date">2024-04-06 15:45:56</span>
                                    </div>
                                    <h3><a href="/php/kak-samostoyatelno-obnaruzhit-spryatannyi-zhuchok-ili-proslushku-v.html">Как самому изготовить детектор для обнаружения прослушки и жучков или глушилку-подавитель радиосигналов от жучков и прослушивающих гаджетов</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/cms/raspinovka-lazernogo-dioda-dvd-lazer-iz-cd-dvd-privoda-a-vot-tak.html"><img src="/uploads/40bda205f582e6b8fa9495eb82a60e71.jpg" class="attachment-wt75_75 wp-post-image" alt="Распиновка лазерного диода dvd"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat364-bg"><a href="/category/cms/">Cms</a></span> <span class="date">2024-04-06 15:45:56</span>
                                    </div>
                                    <h3><a href="/cms/raspinovka-lazernogo-dioda-dvd-lazer-iz-cd-dvd-privoda-a-vot-tak.html">Распиновка лазерного диода dvd</a></h3>

                                </div>
                            </div>
                        </li>
                    












                </ul>

            </div>

            <div id="widget-tab2-content" class="tab-content">
                <ul class="list post-list">

                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/htmlcss/kak-vklyuchit-lazer-iz-dvd-privoda-lazer-iz-dvd-chto-ponadobitsya-v-rabote.html"><img src="https://i2.wp.com/radiostroi.ru/images/remote/images-stories-12fr6.jpg" class="attachment-wt75_75 wp-post-image" alt="Как включить лазер из двд привода"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/htmlcss/">HTML&CSS</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/htmlcss/kak-vklyuchit-lazer-iz-dvd-privoda-lazer-iz-dvd-chto-ponadobitsya-v-rabote.html" title="Как включить лазер из двд привода"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-06 15:45:56</span>
                                    </div>
                                    <h3><a href="/htmlcss/kak-vklyuchit-lazer-iz-dvd-privoda-lazer-iz-dvd-chto-ponadobitsya-v-rabote.html">Как включить лазер из двд привода</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/html5/gologramma-princip-deistviya-vselennaya-gologramma-smotret-chto.html"><img src="https://i2.wp.com/ic.pics.livejournal.com/digitall_angell/38000872/2586030/2586030_original.jpg" class="attachment-wt75_75 wp-post-image" alt="Голограмма принцип действия"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/html5/">HTML5</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/html5/gologramma-princip-deistviya-vselennaya-gologramma-smotret-chto.html" title="Голограмма принцип действия"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-05 16:04:51</span>
                                    </div>
                                    <h3><a href="/html5/gologramma-princip-deistviya-vselennaya-gologramma-smotret-chto.html">Голограмма принцип действия</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/php/sistemnye-trebovaniya-total-war-rome-ii-na-pk-sistemnye-trebovaniya-total-war-rome-ii-na-pk.html"><img src="https://i1.wp.com/s.gamer-info.com/nw/u/d/e/m/u-demonicheskogo-ekshena-devils-hunt-pojavilas-data_400.jpg" class="attachment-wt75_75 wp-post-image" alt="Системные требования Total War: Rome II на ПК Игра рим тотал вар 2 требования"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/php/">Php</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/php/sistemnye-trebovaniya-total-war-rome-ii-na-pk-sistemnye-trebovaniya-total-war-rome-ii-na-pk.html" title="Системные требования Total War: Rome II на ПК Игра рим тотал вар 2 требования"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-04 16:06:31</span>
                                    </div>
                                    <h3><a href="/php/sistemnye-trebovaniya-total-war-rome-ii-na-pk-sistemnye-trebovaniya-total-war-rome-ii-na-pk.html">Системные требования Total War: Rome II на ПК Игра рим тотал вар 2 требования</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/sozdanie-im/ochki-virtualnoi-realnosti-simulyator-robota-yaw-vr-portativnyi.html"><img src="https://i1.wp.com/bestvr.ru/wp-content/uploads/2015/11/2015-10-25-15.01.06-600x360.jpg" class="attachment-wt75_75 wp-post-image" alt="Yaw VR: Портативный симулятор движения для VR"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/sozdanie-im/">Создание ИМ</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/sozdanie-im/ochki-virtualnoi-realnosti-simulyator-robota-yaw-vr-portativnyi.html" title="Yaw VR: Портативный симулятор движения для VR"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-03 16:21:01</span>
                                    </div>
                                    <h3><a href="/sozdanie-im/ochki-virtualnoi-realnosti-simulyator-robota-yaw-vr-portativnyi.html">Yaw VR: Портативный симулятор движения для VR</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/javascript/art-obrabotka-fotografii-v-fotoshope-portret-obrabotka-ot-a-do-ya.html"><img src="https://i0.wp.com/composs.ru/wp-content/uploads/2018/10/retush_fotografij_v_fotoshope7.jpg" class="attachment-wt75_75 wp-post-image" alt="Арт обработка фотографий в фотошопе"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/javascript/">Javascript</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/javascript/art-obrabotka-fotografii-v-fotoshope-portret-obrabotka-ot-a-do-ya.html" title="Арт обработка фотографий в фотошопе"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-02 16:11:25</span>
                                    </div>
                                    <h3><a href="/javascript/art-obrabotka-fotografii-v-fotoshope-portret-obrabotka-ot-a-do-ya.html">Арт обработка фотографий в фотошопе</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/cms/optimiziruem-rabotu-chrome-i-firefox-kak-uskorit-google-chrome-sovety-po.html"><img src="https://i2.wp.com/compsch.com/wp-content/uploads/2016/04/7211.jpg" class="attachment-wt75_75 wp-post-image" alt="Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/cms/">Cms</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/cms/optimiziruem-rabotu-chrome-i-firefox-kak-uskorit-google-chrome-sovety-po.html" title="Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-13 15:58:07</span>
                                    </div>
                                    <h3><a href="/cms/optimiziruem-rabotu-chrome-i-firefox-kak-uskorit-google-chrome-sovety-po.html">Как ускорить google chrome: советы по быстродействию Расширение для ускорения загрузки страниц</a></h3>

                                </div>
                            </div>
                        </li>
                                             <li>
                            <div class="item-post">
                                <div class="thumb overlay">
                                    <a href="/joomla/sposoby-kotorye-pomogut-ubrat-reklamu-v-yandeks-brauzere.html"><img src="https://i2.wp.com/geek-nose.com/wp-content/uploads/2015/04/udalit-reklamu-v-brauzere-6-767x647.png" class="attachment-wt75_75 wp-post-image" alt="Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс"/ loading=lazy></a>
                                </div>
                                <div class="post-right">

                                    <div class="entry-meta">
                                        <span class="entry-cat-bg main-color-bg cat387-bg"><a href="/category/joomla/">Joomla</a></span>
                                        <span class="comments">
														<i class="fa fa-comment"></i>
														<a href="/joomla/sposoby-kotorye-pomogut-ubrat-reklamu-v-yandeks-brauzere.html" title="Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс"></a>	
													</span>
                                        <span class="sep">-</span>
                                        <span class="date">2024-04-13 15:58:07</span>
                                    </div>
                                    <h3><a href="/joomla/sposoby-kotorye-pomogut-ubrat-reklamu-v-yandeks-brauzere.html">Отключаем рекламу в браузере Отключить блокировщик рекламы в яндекс</a></h3>

                                </div>
                            </div>
                        </li>
                    












                </ul>

            </div>

            <div id="widget-tab3-content" class="tab-content">
                
            </div>
        </div>

    </aside>

    <aside id="text-39" class="widget widget_text">
        <div class="textwidget">
            

        </div>
    </aside>
    
    <aside id="categories-5" class="widget widget_categories">
        <div class="widget-title">
            <div class="icon"></div>
            <h4>Рубрики</h4>
        </div>
        <ul>
                                        <li class="cat-item cat-item-"><a href="/category/cms/" title="Cms">Cms</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/htmlcss/" title="HTML&CSS">HTML&CSS</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/html5/" title="HTML5">HTML5</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/javascript/" title="Javascript">Javascript</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/javascript--ajax/" title="Javascript & Ajax">Javascript & Ajax</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/joomla/" title="Joomla">Joomla</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/php/" title="Php">Php</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/seo/" title="Seo">Seo</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/wordpress/" title="Wordpress">Wordpress</a>
                </li>
                            <li class="cat-item cat-item-"><a href="/category/web-design/" title="Веб-дизайн">Веб-дизайн</a>
                </li>
            
        </ul>
    </aside>
    <aside id="pages-3" class="widget widget_pages">
        <div class="widget-title">
            <div class="icon"></div>
            <h4>Страницы</h4>
        </div>
        <ul>
            <li class="page_item page-item current_page_item"><a href="/">Главная</a></li>
            <li class="page_item page-item"><a href="/sitemap.xml">Карта сайта</a></li>
            <li class="page_item page-item"><a href="">Обратная связь</a></li>
        </ul>
    </aside>
</div>


				<script type="text/javascript">try{ var sbmt=document.getElementById('submit'),npt=document.createElement('input'),d=new Date(),__ksinit=function(){ sbmt.parentNode.insertBefore(npt,sbmt);} ;npt.value=d.getUTCDate()+''+(d.getUTCMonth()+1)+'uniq9065';npt.name='ksbn_code';npt.type='hidden';sbmt.onmousedown=__ksinit;sbmt.onkeypress=__ksinit;} catch(e){ }</script>
				</div>
	</section>

	

<footer id="footer">
		<div class="footer-info">
			<div class="inner-wrap">
				 
					<div class="footer-left">
    ©2024 rannts.ru. Rannts - сообщество интернет профессионалов.
</div>
								
			</div>		
		</div>		
	</footer>


	
</div>



<script src="/assets/f89d23060861.js"></script><script>eval(mod_pagespeed_EkfnzzgNGm);</script>
<script>eval(mod_pagespeed_shdP3JvG92);</script>

<script src="/assets/7b94457a3345.js"></script><script>eval(mod_pagespeed_Vge0eYZiX0);</script>
<script>eval(mod_pagespeed_rFiwlK0V2n);</script>
<script>eval(mod_pagespeed_NkJ$svdfCI);</script>
<script>eval(mod_pagespeed_7QExw1e8GG);</script>
<script>eval(mod_pagespeed_NPRmC_hb_5);</script>
<script>eval(mod_pagespeed_dhTtrfIRt5);</script>
<script>eval(mod_pagespeed_8GKEZu2sI0);</script>
<script>eval(mod_pagespeed_33o$kFwZth);</script>
<script>eval(mod_pagespeed_oQOVaecd7j);</script>
<script>eval(mod_pagespeed_2zXveon5ZR);</script>
<script>eval(mod_pagespeed_oLL3YdMpkr);</script>
<script>eval(mod_pagespeed_E3V$0UKdeS);</script>

<script type='text/javascript'>;(function($){ var globaldata=window.ec_ajax_data||null;$.fn.wpAjaxRating=function(){ return this.each(function(){ var el=this,post_id=parseInt(this.getAttribute('data-post-id'),10);$(this).on('click','a',function(e){ var rating=parseInt(this.getAttribute('data-value'),10),data={ "action":"ec_stars_rating","rating":rating,"post_id":post_id} ,update_value=function(result,count){ $(el).addClass("is-voted").find('.ec-stars-overlay').css({ "width":(100-result*100/5)+'%'} ).end().parent().find('.ec-stars-rating-count').html(count).end().parent().find('.ec-stars-rating-value').html(parseInt(result*100)/100);} ,show_message=function(message){ el.setAttribute('data-tooltip',message);} ;if(globaldata===null){ globaldata=window.ec_ajax_data||null;} e.preventDefault();if((/\bis-voted\b/).test(el.className)===null||rating>5||rating<1){ return;} $.post(globaldata.ajax_url,data,function(response){ switch(response.status){ case globaldata.codes.PREVIOUSLY_VOTED:show_message(globaldata.messages.previously_voted);break;case globaldata.codes.REQUEST_ERROR:show_message(globaldata.messages.request_error);break;case globaldata.codes.SUCCESS:update_value(response.result,response.votes);show_message(globaldata.messages.success);break;default:show_message(globaldata.messages.unknown);} },"json")} );} );} ;$(function(){ $('.ec-stars-wrapper').wpAjaxRating();} )} (window.jQuery))</script>




</body>
</html>