{"draftJsState":{"blocks":[{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"В некоторых случаях необходимо, чтобы какая-то строка выводилась в браузере без разрыва, даже если она не помещается в окне целиком. Например, это может потребоваться при выводе на HTML-странице компьютерных команд, которые могут быть достаточно длинными. В таких случаях разрывать строку нежелательно, потому что восприятие разорванной команды будет хуже.","type":"unstyled","key":"fv3dm"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Однако браузеры автоматически выполняют перевод строк, если текст не помещается в окне по ширине. Что делать?","type":"unstyled","key":"tirj"},{"data":{},"depth":0,"entityRanges":[{"key":0,"length":4,"offset":12}],"inlineStyleRanges":[{"length":4,"offset":12,"style":"BOLD"}],"text":"В стандарте HTML есть тег

, который выводит текст “как есть”, то есть без принудительного переноса текста на новую строку. Это старый проверенный способ, который поддерживается почти всеми браузерами. Однако он не безупречен.","type":"unstyled","key":"js3e"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Во-первых, он отображает текст моноширинным шрифтом, который, как правило, отличается от шрифта страницы. В большинстве случаев это именно то, что нужно. Однако бывают исключения.","type":"unstyled","key":"ebbof"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Во-вторых, отформатированный вручную текст внутри этого тега в некоторых случаях может выводиться не совсем так, как мы ожидаем.","type":"unstyled","key":"2rmc9"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Но есть хорошая замена тегу , когда надо сделать так, чтобы текст выводился в одну строку. Это тег . Его нет в стандарте HTML, однако большинство браузеров его поддерживают.","type":"unstyled","key":"16ti1"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Действие этого тега заключается в том, что браузер обращается с текстом, помещённым внутри пары тегов , как с одним словом. Кстати, как вы поняли - это парный тег. Содержимое тега отображается текущим шрифтом и внутри тега при необходимости можно установить другой стиль.","type":"unstyled","key":"c12nr"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Также браузер не прекращает обычный вывод содержимого внутри тега . Вы можете вставлять рисунки, таблицы - что угодно. Или разорвать строку с помощью, например, 
. Единственный эффект применения тега  состоит в подавлении автоматического перехода на новую строку при достижении текущей строкой правого края окна.","type":"unstyled","key":"867d2"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Пример:","type":"unstyled","key":"36mns"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"","type":"blockquote","key":"120fn"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Это длинная-длинная строка, которая по нашей задумке","type":"blockquote","key":"fa47j"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"не должна разрываться, то есть браузер не должен","type":"blockquote","key":"8kg26"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"автоматически переводить строку, если она не","type":"blockquote","key":"4i7vc"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"помещается в окно по ширине.","type":"blockquote","key":"blbv1"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"","type":"blockquote","key":"fbbg6"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Ну а на рисунках ниже показано, как этот текст выглядел бы без использования тега , и как с тегом .","type":"unstyled","key":"1itk4"},{"data":{"image":{"id":"63d9ef35bec0c250bef9844e"}},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Как выглядит текст в обычном режиме","type":"atomic:image","key":"20rru"},{"data":{"image":{"id":"63d9ef43dd54816e80717cd6"}},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"Как выглядит текст при использовании тега ","type":"atomic:image","key":"29hbe"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"На этом всё. Подписывайтесь на канал, чтобы ничего не пропустить.","type":"unstyled","key":"52ed1"},{"data":{},"depth":0,"entityRanges":[],"inlineStyleRanges":[],"text":"","type":"marker","key":"lqufXCrIpxRKCF0CAlJo"}],"entityMap":{"0":{"data":{"href":"https://info-master.su/programming/web/html/","url":"https://info-master.su/programming/web/html/"},"mutability":"MUTABLE","type":"LINK"}}},"mentions":[]}