Коды html для текста: Форматирование текста | htmlbook.ru

Leave a Comment / Html / By /

Содержание

что это и как применять

Положительная репутация в поисковых системах без помех от недоброжелателей возможна с Семантикой!

Узнайте стоимость

Получи нашу книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

Подпишись на рассылку и получи книгу в подарок!

Html-теги для текста – это теги, которые меняют оформление заключенного в них контента.

Эта идея пришла из печатных издательств. Редакторы на полях помечали, что является заголовком, как оформить список.

Так же и теги. Они указывают, какой стиль должен быть у элемента.

Теги и элементы

Каждый тег имеет вид:

<Название тега>

Элемент – это совокупность тега и его содержимого. Многие из них требуют закрывающего тега:

</Название тега>

Особенно это касается текстовых тегов. Закрывающий показывает, когда следует прекратить оформление или закончить блок, таблицу, заголовок и т.

д.
Примеры элементов:

  • <h2>Header</h2>
  • <div>Блок</div>
  • <i>курсив</i>

Некоторые элементы не требуют закрытия

  • <img src=”1.jpg”>
  • <hr>

В таких случаях отсутствует содержимое и браузер просто размещает на экране заданный объект. В первом случае это рисунок, во втором линия. Закрывающий используется, когда в элементе есть содержимое: текст и/или другие теги.

Верстальщик сайтов знает, для чего предназначен каждый тег и как поведет себя «обернутое» в элемент содержимое.

Парадигма оформления современных сайтов

Первоначально разметка позволяла и оформлять страницы, и указывать логическое назначение блоков. Новая версия HTML 5.0 нацелена на логическую разметку. Таким образом определяются тематические разделы на странице. При этом подходе и поисковым машинам, и людям легче ориентироваться в коде.

Все оформление выполняется в стилистических таблицах CSS в виде правил. Назначая каждому элементу класс или идентификатор, верстальщик указывает свойства стиля и устанавливает его значение. Хранение стилей в отдельном файле позволяет выполнить единое оформление для всех страниц сайта.

Но самый большой плюс заключается в легкости изменения дизайна всего ресурса. Изменяя одно значение для фона, верстальщик получает новый бэкграунд на всех страницах, где это правило использовалось.

Валидация страницы

При продвижении сайта важную роль играет его валидность: «правильность» кода и соответствие его стандартам. Так как в настоящее время распространены два стандарта HTML – 4 и 5, то используются различные виды объявления типа документа:

  1. Strict. Не включает теги font, фреймы и пр. Это «строгий» набор правил для верстки на HTML 4.<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01//EN» «http://www.w3.org/TR/html4/strict.dtd»>
  2. Transitional. Используется для сайтов, которые были написаны до появления новых стандартов. Разрешены устаревшие теги. <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01//EN» «http://www.w3.org/TR/html4/strict.dtd»>
  3. HTML. Поддержка последнего стандарта.<!DOCTYPE HTML>

Каждый документ должен ссылаться на правила и соблюдать их. Используются только те элементы, которые разрешены стандартом. В связи с этим в новом стандарте указываются теги, которые считаются устаревшими. Их использование не рекомендуется. К ним относится большая часть тегов, предназначенных исключительно для форматирования контента.

Проверить валидность сайта можно на официальном сайте W3C – организации, где создаются стандарты.

Теги форматирования текста html

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

Рассмотрим все элементы, которые позволяют оформить текстовую часть сайта.

  • <b>— Жирное выделение.
  • <basefont>— Установка цвета и шрифта по умолчанию для страницы. Не рекомендуется к использованию.
  • <big> — Увеличивает размер шрифта на одну условную единицу. Всего их семь. Стандартный не оформленный символ имеет размер 3. Вложение тегов будет увеличить на дополнительную единицу на каждом уровне. В CSS аналогом является свойство font-size.
  • <cite> — Логическая метка текста как цитаты или сноски. Символы оформляются курсивом, но это можно изменить в таблице стилей.

 

  • <code> — Вывод символов, которые помечаются как программный код. Оформляется моноширинным текстом уменьшенного размера (все символы имеют одинаковую ширину).
  • <dfn>— Необходимо заключать в этот тег первое упоминание термина в статье. Отображается курсивом во всех браузерах.
  •   <em>— Используется для привлечения внимания к фрагменту контента. Выделяется курсивом. Аналог CSS font-style.
  • <font> — Самый запрещенный тег для текста в современной разметке. Браузеры его еще поддерживают, так как многие встроенные редакторы используют его для указания размера и шрифта. Но при ручной верстке не рекомендуем применять такой способ форматирования. Лучше пользоваться свойствами CSS font-size и color – аналоги написания<font size=”Размер”color=”Цвет”>.
  • <h2>-<h6>— Логическое выделение структуры заголовков контента. Текст между открывающим и закрывающим тегами помечается жирным и имеет нестандартный размер. Главный заголовок h2 имеет самый большой шрифт, h6 — самый маленький.
  • <i> — Курсив. Не осуждается последним стандартом, но рекомендуется использовать font-style.
  • <kbd>— Обозначает моноширинным шрифтом имитацию напечатанного на клавиатуре текста.
  • <mark>— Логическое выделение контента. Дополнительно Chrome и FireFox подсвечивают его желтым фоном.
  • <p> — Абзац. Контент, помеченный этим тегом начинается с новой строки. Между ними ставится отступ. Не требует закрывающего тега, новый абзац начинается при появлении любого блочного элемента.
  • <pre>— Используется для оформления текста так, как он был указан при верстке. По умолчанию в HTML любое количество подряд идущих пробелов трансформируются в один, а обычные переносы не учитываются. Элемент pre учитывает положение символов.>
  • <q> — Выделение цитат, текст отображается в кавычках.
  • <samp>— Отображает символы как на результат выполнения программы на экран. Используется моноширинный шрифт.
  • <small>— Выполняет действия, обратные элементу big, уменьшая размер символов на условную единицу.
  • <strike> — Зачеркивает текст. Аналог сокращенного элемента. Не рекомендуется использовать. Аналог CSS text-decoration со значением line-through.
  • <strong>— Жирное начертание. Логически акцентирует текст.
  • <sub>— Показывает символ в нижнем индексе. Размещается ниже стандартной базовой линии, на которой располагаются символы, и имеет уменьшенный размер. В CSS используется vertical-align.
  • <sup>— Показывает символ в верхнем индексе. Размещается выше базовой линии стандартного текста и имеет уменьшенный размер. В CSS используется vertical-align.
  •  <sup>— Используется для подчеркивания текста. В HTML 5 запрещен, используется свойство CSS text-decoration со значением underline.
  •  <var> — При выводе кода компьютерной программы все переменные заключаются в этот тег. Выделяет их курсивом.
  • <xmp> — Показывает текст так, как он записан в коде страницы. Аналогично pre.

Специальные символы

Помимо текста и медиа-контента, на страницу можно выводить небольшие изображения. Они выглядят как иконки, но вставляются в текст не картинками, а спецсимволами. Некоторые примеры приведены в таблице.

Также в HTML 5 появились деньги, карточные масти и знаки гороскопа.

Используйте в разметке Html текстовые теги, которые подчеркивают логическое значения текста. Не стоит оформлять каждый фрагмент контента отдельно. Это допустимо только в случае, если вы точно знаете, что такое форматирование больше нигде не повторяется. Для одинаковых стилей используйте классы CSS.

В дальнейшем такой подход поможет сэкономить время на изменении дизайна, а также повысить шансы на попадание в ТОП поисковых систем.

HTML теги для форматирования текста

❮ Назад Вперед ❯

Вид текста на экране зависит от того, какие HTML теги были использованы для его форматирования. Теги форматирования делятся на две категории: теги физической разметки, которые отвечают за стилевое оформление (жирное начертание, курсив, шрифт и т.д.) текста, и теги логической разметки, которые несут смысловую нагрузку (например, дают понять поисковым системам по каким словам необходимо ранжировать веб-страницу).

Рассмотрим подробно теги форматирования и объясним нюансы их применения.

Теги <h2>-<h6> используются для структурирования HTML заголовков. В HTML используются 6 уровней заголовков, от <h2> до <h6>. <h2> используется для обозначения самого важного, а <h6> наименее важного заголовков.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы </title>
  </head>
  <body>
    <h2>Заголовок первого уровня</h2>
    <h3>Заголовок второго уровня</h3>
    <h4>Заголовок третьего уровня</h4>
    <h5>Заголовок четвертого уровня</h5>
    <h5>Заголовок пятого уровня</h5>
    <h6>Заголовок шестого уровня</h6>
  </body>
</html>

Попробуйте сами!

Результат

HTML теги <b> и <strong> задают полужирное начертание шрифта. Разница между ними заключается в том, что тег <b> является тегом физической разметки, и выделяет текст без акцента на его важность. Тег <strong> же определяет текст, которому придают особую важность. Содержимое тега имеет большой вес для поисковиков, а устройства, считывающие с экрана, выделяют его определенной интонацией.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Мы использовали тег &lt;strong&gt;, чтобы выделить <strong> этот важный фрагмент текста</strong>.</p>
  </body>
</html>

Попробуйте сами!

Результат

Теги <i> и <em> задают курсивное начертание шрифта. Тег <i> текст является элементом физической разметки, то есть вложенный текст отличается только визуально и не воспринимается как важный браузерами и поисковыми машинами. Тег <em> экспрессивно-эмоционально выделяет фрагмент текста.

Пример

<!DOCTYPE html>
<html>
  <body>
    <p>Это обычный абзац</p>
    <p>Важный фрагмент текста выделяется <em>курсивным начертанием</em></p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <pre> используется для включения в HTML-документ предварительно отформатированного текста. Во вложенном в тег тексте сохраняются все пробелы и разрывы строк (как известно, браузеры по умолчанию любое количество идущих подряд пробелов показывают как один).

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <pre>Крошка сын
               к отцу пришёл,
               и спросила кроха:
               — Что такое 
                хорошо
                и что такое 
                плохо? —</pre>
  </body>
</html>

Попробуйте сами!

Результат

Как вы заметили, все пробелы и переносы строк сохранены в браузере.

Тег <mark> определяет выделенный / подсвеченный текст. Визуально содержимое тега выглядит как отмеченное маркером желтого цвета.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Изучайте язык гипертекстовой разметки HTML на сайте <mark>W3Docs. com</mark>.</p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <small> определяет размер шрифта текста на один размер меньше, чем у родительского элемента. В HTML5 тег используется для хранения информации об авторских правах, а также определения мелкого, либо юридического шрифта.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Использование тега SMALL</title>
  </head>
  <body>
    <p>Процентная ставка всего 10%*</p>
    <small>* - в день</small> /
  </body>
</html>

Попробуйте сами!

Результат

Тег <del> выделяет часть текста, которая была удалена из документа.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Мой любимый цвет <del>зеленый</del> <ins>синий</ins>!</p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <s> используется для определения текста, который больше не актуален.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p><s>Я учусь в школе</s></p>
    <p>Я учусь в институте.</p>
  </body>
</html>

Попробуйте сами!

Результат

Содержимое обоих тегов браузеры отображают как перечеркнутый текст. Несмотря на внешнюю схожесть, теги не могут заменять друг друга.

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

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Ее любимые цветы <del>фиалки</del> <ins>подснежники</ins>․</p>
  </body>
</html>

Попробуйте сами!

Результат

В тег <u> заключается текст, который стилистически отличается от остального текста, например, слова с орфографическими ошибками или текст на другом языке.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
  </head>
  <body>
    <p>Здесь мы использовали <u>элемент &lt;u&gt;</u>.</p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <sub> используется для определения текста с нижним индексом. Тег выравнивает элемент как подстрочный. Тег <sup> используется для определения текста в верхнем индексе.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Формула воды -H<sub>2</sub>O,  а формула спирта - C<sub>2</sub>H<sub>5</sub>ОН </p>
    <p>E = mc<sup>2</sup>, где E — энергия объекта, m — его масса, c — скорость света в вакууме.  </p>
  </body>
</html>

Попробуйте сами!

Результат

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

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p><dfn>HTML</dfn> (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML</p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <p> определяет абзац в тексте. Друг от друга абзацы отделяются пустой строкой. Браузер автоматически добавляет верхний и нижний отступ, равный 1em, при этом отступы соседних абзацев «схлопываются».

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <p>Это первый абзац</p>
    <p>Это второй абзац</p>
  </body>
</html>

Попробуйте сами!

Результат

Тег <br> устанавливает перевод строки, то есть все написанное после него, будет перенесено на новую строку. В отличие от тега <p> перед строкой пустой отступ не добавляется.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
  </head>
  <body>
    <h2>Пример использования тега &lt;br&gt;</h2>
    <p> Внутри абзаца мы можем вставить тег &lt;br /&gt;, <br /> чтобы перенести часть текста на другую строку в случае необходимости.</p>
  </body>
</html>

Попробуйте сами!

Результат

В HTML5 тег <hr> используется для тематического разделения контента на странице. В предыдущих версиях HTML он использовался для создания горизонтальной линии на странице, визуально разделяя контент. В новой версии он приобрел смысловую нагрузку и определяет не только визуальный, но и тематический разрыв контента.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <h2>Футбол</h2>
    <p>Командный вид спорта, в котором целью является забить мяч в ворота соперника. </p>
    <hr>
    <h2>Баскетбол</h2>
    <p>Спортивная командная игра с мячом, в которой мяч забрасывают руками в корзину (кольцо) соперника.</p>
  </body>
</html>

Попробуйте сами!

Результат

теги форматирования абзацев и текста в html

Цель урока: изучение основных тегов для форматирования текста html и абзацев.

Содержание:

  • Элементы форматирования текста
    • Заголовки
    • Блочная цитата
    • Преформатированный текст
    • Курсив, жирность, подчеркивание и другие теги
    • Горизонтальная линия
    • Горизонтальная линия
  • Атрибуты тегов
    • Атрибуты тега body
  • Теги логического форматирования текста
  • Элементы форматирования абзацев
    • Цвет и гарнитура шрифта
    • Специальные символы

Элементы форматирования текста

Заголовки

  • Для размещения заголовков существует тег <h> с номером уровня заголовка.

    • <h2></h2>

  • Самый крупный заголовок соответствует тегу <h2>, соответственно заголовок самого низкого уровня (самый мелкий размер шрифта) — <h6>.
  • Базовый размер шрифта на странице соответствует заголовку <h4>:
<h2>Заголовок 1</h2>
<h3>Заголовок 2</h3>
<h4>Заголовок 3</h4>
<h5>Заголовок 4</h5>
<h5>Заголовок 5</h5>
<h6>Заголовок 6</h6>

Заголовок 1

Заголовок 2

Заголовок 3

Заголовок 4

Заголовок 5

Заголовок 6

Блочная цитата

<blockquote></blockquote>

Для размещения в тексте цитаты используется тег <blockquote>:

Преформатированный текст

<pre></pre>

Для того, чтобы сохранить в тексте все пробельные символы, необходимо использовать тег <pre>. Но при этом следует учесть, что для содержимого данного тега невозможно задать стиль шрифта:

<pre>
Вот иду я,
	заморский страус,
		в перьях строф, 
			размеров и рифм.
Спрятать голову, 
	глупый, 
		стараюсь,
			в оперенье звенящее врыв.
Вот иду я,
	заморский страус,
		в перьях строф, 
			размеров и рифм.
Спрятать голову, 
	глупый, 
		стараюсь,
			в оперенье звенящее врыв.

Курсив, жирность, подчеркивание и другие теги

Горизонтальная линия

<hr>

Данный элемент служит для разделения некоторых структурных элементов текста друг от друга. Либо может быть использован просто как эстетический элемент оформления документа:

<h4>Горизонтальная линия</h4>
<hr>
<p>Lorem ipsum dolor sit amet.</p>

Горизонтальная линия

Lorem ipsum dolor sit amet.

Атрибуты тегов

  • Для уточнения действия некоторых тегов они дополняются атрибутами.
  • Так, у рассмотренного тега горизонтальной линии есть дополнительные свойства, выраженные в атрибутах
    • size — ширина линии,
    • width — длина линии,
    • align — выравнивание линии

    и другие.

  • Атрибуты указываются в открывающем теге в виде атрибут=значение.
  • Атрибутов может быть несколько, тогда они указываются через пробелы, и их порядок следования практически не важен.

Атрибуты тега body

Для начала рассмотрим два основных атрибута тега body:

  • bgcolor — задний фон страницы и
  • text — цвет текста на всей странице.

Для задания цвета можно использовать названия цветов на английском языке, либо код цвета в шестнадцатеричной системе счисления.

<body text="#00ff00">

или

<body text="green">


Перед указанием цвета в 16-й системе обязательно ставится символ «шарп» — #
Для подбора подходящего цвета перейдите на страницу палитры цветов онлайн.

Теги логического форматирования текста

В html есть теги, которые несут больше не эстетическую нагрузку, а логическую или смысловую нагрузку. Т.е. большинство из них внешне влияет на содержимое, делая его подчеркнутым или выделяя каким-либо другим образом. Но созданы эти теги логического форматирования с целью выделить смысловую характеристику содержимого:

Например, тег del делает содержимое перечеркнутым, при этом указывая прежде всего на смысл удаления текста.

Элементы форматирования абзацев

  • Для перехода на другую строку текста служит пустой элемент <br>.
  • Тогда как для выделения в тексте абзаца служит элемент <p>, содержимое которого и является сам абзац. Перед абзацем и после него добавляются отступы, но красная строка при этом не предусмотрена.

Пример совместного использования тегов <br> и <p>:

Задание html 1.
Скачайте текст по ссылке ниже. При помощи редактора или блокнота выполните должное форматирование документа, добавив необходимые на Ваш взгляд теги (заголовки, теги форматирование шрифта и абзацев).

Текст: Файл задания 1.

Желаемый результат:

Цвет и гарнитура шрифта

Для форматирования шрифта существует тег <font>. Однако, тег уже практически не используется.

<font></font>

Тег используется только со своими атрибутами:

  • size — размер шрифта, от 1 до 7 (3 — базовый размер, 6 — размер заголовка h2)
  • face — семейство шрифта (serif — с засечками, sans-serif — рубленый или без засечек, monospace — моноширинный)
  • color — цвет

Пример:

<font size="4" color="#ff0000" face="Arial, Verdana, sans-serif">
Текст красного цвета, шрифт без засечек
</font>

Результат а браузере:


Текст красного цвета, шрифт без засечек

Специальные символы


        код html
©	 &cоpy;	  Копирайт
®	 &rеg;	  Знак зарегистрированной торговой марки
™        &trаde;  Знак торговой марки
	 &shу;	  Мягкий перенос
×	 &timеs;  Умножить
÷	 &dividе; Разделить
±	 &рlusmn; Плюс/минус
≤	 &lе;	  Меньше или равно
≥	 &gе;	  Больше или равно

Задание html 2:
Скачайте файл с текстом для задания и изображение. При помощи редактора или блокнота выполните форматирование документа, сделав результат максимально похожим с картинкой.

Задание html 3:
Скачайте файл с текстом для задания. Откройте файл в редакторе кода (например, notepad++). Выполните подряд все задания, указанные в комментариях html. Протестируйте результат в браузере.

Базовое форматирование | Форматирование текста HTML, абзацы и разрывы строк

Путь // www.yourhtmlsource.com → Мой первый сайт → ОСНОВНОЕ ФОРМАТИРОВАНИЕ

Росс Шеннон

Итак, вы написали короткую страницу, чтобы доказать, что можете писать HTML. Это прекрасно и все такое, но в нем чего-то не хватает, не так ли? Вы хотите, чтобы что-то выделялось больше, хотите пропускать строки и использовать курсив.

Вы хотите отформатировать .

Навигация по страницам:
Форматирование текста | Отметить вопросы | Пропуск строк | Атрибуты | Заголовки · Итак, давайте посмотрим на них! | Линии | Комментарии | Разнесены | Первая проверка

Эта страница последний раз обновлялась 21 августа 2012 г.


Примечание:
Во время написания кода у вас должны быть одновременно открыты и редактор, и браузер. Всякий раз, когда вы вносите изменения в свой html-код, сохраните его, переключитесь в браузер и нажмите , обновить , и страница обновится до самой новой версии.

Форматирование текста

Ну, вы же помните из прошлого туториала, как вам понадобился начальный тег и конечный тег верно? Начните с начального тега, закончите конечным тегом. Простой. Вы уже знаете, что означает жирный шрифт. Давайте обновим.

Привет, меня зовут Росс и я блестящий . Да, верно, я гениальный !

Ах… теперь я чувствую себя хорошо. Кроме того, я хитро замаскировал это под урок HTML. Чтобы сделать жирный текст, я сделал следующее:

гениально

Вот и все. Просто окружите нужный текст этими тегами.

Надеюсь, скоро будет еще интереснее, а? Хорошо, хотите выучить курсив ? Это так же просто. Код для этого i . Таким же образом:

превосходный материал становится превосходным материалом .

Подчеркивание тоже смехотворно просто — просто используйте

Просто подчеркните меня подчеркиванием, мааан

Возвращаясь к дням карточек, вы может даже сделать так, чтобы ваш текст выглядел так, будто его напечатали на пишущей машинке — используйте тт .

День двенадцатый. Немцы окружили наш хутор
становится… что в таком тексте.

Во всех приведенных выше примерах используются презентационные теги. Вместо этого вы можете использовать логические теги, которые сделают ваш контент более доступным.

Ваш браузер отображает только один пробел между словами. Если вы добавите больше пробелов в исходный код, они будут проигнорированы. Если вы хотите принудительно добавить дополнительные пробелы, вы можете использовать специальный символ   , что означает «неразрывное пространство». При этом вы можете создавать отступы для вашего текста.

   Этот текст будет иметь отступ

Вопросы по тегам

Должны ли теги быть написаны ЗАГЛАВНЫМИ БУКВАМИ?
Нет, не знают. Вы можете использовать или . Я предпочитаю делать все строчными, потому что это выглядит намного аккуратнее, когда вы читаете и редактируете свой код, и подходит для версии HTML, в которой я кодирую, но это не меняет того, как они работают. Тебе решать.

Можно ли смешивать их вместе?
Ты действительно становишься предприимчивым, не так ли? Да, ты можешь. Просто окружите нужный текст обоими наборами тегов — вот так

Следует отметить, однако, что порядок, в котором вы размещаете их в . Если вы начнете с b , вы закончите с b . В приведенном выше примере был последним открытым тегом, поэтому это 9-й тег.0010 первый один закрытый. Это то, что вы должны помнить, потому что важность синтаксиса вашего тега становится критической позже. Этот стиль открытия и закрытия называется LIFO — «последний пришел, первый ушел».

Такое размещение тегов друг в друге называется вложением .

Пропуск строк

Вы, наверное, уже заметили, что при отображении в браузере ваша страница кажется лишенной всех абзацев и прочего. Ваш браузер игнорирует любые возвраты и отступы. Ну так что ты делаешь? Вы используете
, что означает «строка BR eak». Это известно как «пустой элемент» — тег, которому не нужен закрывающий тег — просто введите его, и текст начнется с новой строки.

Или как насчет пропуска строки и создания абзацев? Для этого используйте

, что означает « P aragraph». Есть два способа использования p . Вы можете просто поместить его в конец абзаца, чтобы пропустить строку и перейти к следующей; или можно поставить

в начале абзаца и

в конце. Я предпочитаю последний, потому что он выглядит аккуратнее и дает больше гибкости. Вы должны использовать его слишком.

Добро пожаловать на мою страницу.

Надеюсь, вам понравится.

Атрибуты

Теперь я собираюсь сделать немного более продвинутым. Для центрирования текста используется базовый тег

. Но это заменяется, поэтому лучший способ сделать это — выровнять по абзацу. Это включает присвоение тегу атрибута . Тег сам по себе что-то делает, но затем вы можете добавить атрибуты для дальнейшего определения того, что делает тег. Позже вы увидите множество других тегов, имеющих атрибуты — они являются очень важной частью HTML. Структура атрибута:

Очень важно Затронутый текст

Все теги могут иметь несколько атрибутов одновременно, но для определенных тегов работают только некоторые атрибуты. Это просто вопрос их обучения. Кроме того, не забудьте заключить значение в кавычках .

Таким образом, чтобы добавить значение center к тегу p , структура будет следующей:

Centered Text

Сравните это с примером выше, чтобы увидеть Что к чему. p — тег, align — атрибут, center — значение атрибута.

Обратите внимание, что когда закрывает исходный тег ( p ), все его атрибуты берутся вместе с ним, и все, что вам нужно, это обычный закрывающий тег (т.е. не начинайте вставлять в него атрибуты).

Очевидно, что если его можно выровнять по центру, его можно выровнять и другими способами. Вы можете выровнять по левому краю и по правому краю . Но нет смысла писать

, потому что все равно весь текст выравнивается по левому краю. Это известно как по умолчанию .

Заголовки

Вначале тэги заголовков были изобретены как градуированный метод размещения и разделения информации. Вы использовали большие заголовки для основных моментов на странице и спускались по номерам. Существует 6 категорий или уровней заголовков HTML:

до
. Графически они создают текст с уменьшением размера: h2 — самый большой, а h6 — самый маленький из группы.

Итак, давайте их посмотрим!

О, это моя реплика. Хорошо: вот примеры:

Заголовок 2

Заголовок 3

Заголовок 4
Заголовок 5
Заголовок 6

Вы просто оборачиваете предпочтительный тег заголовка вокруг текста, например:

2 3

Текст станет жирным и большим. Следует отметить, что заголовки всегда располагаются на расстоянии от остального текста на расстоянии , как абзац. Это свойство тегов блочного уровня. Вы не можете объединить заголовки и обычный текст. Если вы хотите, чтобы текст следовал сразу же, вы должны просто изменить размер шрифта и не использовать заголовок.

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

до
).

sourcetip: Заголовки принимают цвет и шрифт окружающего текста, поэтому вы можете изменить цвет заголовков, скажем, обернув цвет шрифта вокруг тега h . Прочтите этот учебник по шрифту и цвету, чтобы узнать больше.

Заголовки также могут быть выровнены по . Значения: по центру , по ширине , по левому краю или по правому краю .

Строки

Некоторые другие очень простые вещи используют линии поперек страницы. Чтобы сделать их, используйте

, что означает « H orizontal R ule».
Просто поместите это в любом месте на вашей странице (конечный тег не нужен), и текст остановится, и появится большой

, а затем ваш текст продолжится. Красиво, а?

Ими также можно управлять с помощью атрибутов . Они могут быть выровнены по левому и правому краям, как p выше. У них также есть два других атрибута, которые относятся к размеру линии.

ширина ="100"> создаст

такого маленького парня. Здесь вы указываете ширину в пикселях или можете использовать проценты, например

, что создаст линию шириной на 80% от доступной ширины экрана.

Чтобы сделать линии более сильными,

size ="4" noshade> создаст большой, мускулистый

Вы видели, что noshade немного? Это особый атрибут, уникальный для hr , и ему не нужно значение. Он останавливает hr с двумя оттенками серого.

Это также показывает, что в одном и том же теге одновременно можно использовать множество различных атрибутов. Немного поэкспериментируйте с ними.

Как только ваши документы начнут заполняться запутанными тегами и разделами, вам нужно будет знать, какая часть какая. Вы используете HTML-комментарии к , добавляете примечания к своему коду , чтобы вы могли легко прочитать его в следующий раз, когда вернетесь, чтобы отредактировать его. Код для комментария немного отличается от кода для других тегов:

Все, что вы поместите между строками , будет полностью пропущено вашим браузером. Вы можете добавить решетку (#), чтобы ваши комментарии выделялись. При прокрутке HTML-кода страницы вы хотите, чтобы ваши структурные комментарии выделялись. Комментарии будут использоваться позже в HTML, чтобы скрыть информацию от старых браузеров. Они очень полезны — используйте их и помогите себе.

Spaced Out

То, как вы размещаете свой исходный код, в большинстве случаев является делом вкуса. Вы можете сделать отступ для некоторых тегов от левого поля, чтобы их было легко увидеть, и пропускать строки после каждого абзаца. Это не имеет большого значения для вашего браузера, который обычно игнорирует пробелы, табуляции, пустые строки и другие символы пробела при отображении ваших страниц. Однако я должен предупредить вас, что иногда лишние символы пробела могут что-то испортить. Это не серьезно, но строку, подобную приведенной ниже, следует исправить:

Подчеркнутый текст.

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

Первая проверка

Вероятно, вы добавили на свою страницу довольно много новых тегов. Проверка — это процесс, с помощью которого вы убедитесь, что за все ваши действия вы не внесли никаких неприятных ошибок в свой прекрасный простой код. Чтобы проверить, действителен ли HTML-файл, вы можете использовать онлайн-валидатор, такой как » W3C-валидатор. Это бесплатная служба, которая сканирует ваш файл (будь то онлайн или любую страницу на вашем компьютере) и возвращает список ошибок, если находит их. Он прост в использовании — введите адрес веб-страницы в форму, и она запустится и проведет необходимые тесты.

Когда ошибка диагностируется, ее обычно легко отследить и устранить с большим предубеждением. Не относитесь легкомысленно к предупреждениям валидатора; это важный процесс, и многие небрежные программисты игнорируют его. Позже они сожалеют об этом. О да, они делают.

Если ваш код действителен, у него гораздо больше шансов работать в каждом браузере , что означает, что больше людей смогут прочитать ваш материал. Хотя вероятность того, что в вашем коде будет много критических ошибок, на данный момент невелика, если у вас есть целый сайт для обслуживания, гремлины часто могут проникнуть в ваш код, угрожая доступности ваших страниц. Итак, часто проверять . Всякий раз, когда на вашем сайте выполняется какая-либо другая крупная работа, снова запускайте ее через машину, чтобы убедиться, что все в порядке. Это сделает меня счастливым.

А теперь; мы связываем!

Абзацы, строки и фразы

Абзацы, строки и фразы

 предыдущий следующий содержимое   элементы   атрибуты   индекс

Содержимое

  1. Пустое пространство
  2. Структурированный текст
    1. Элементы фразы: ЭМ , СИЛЬНЫЙ , ДФН , КОД , САМП , КБД , ВАР , CITE , ABBR и АКРОНИМ
    2. Цитаты: BLOCKQUOTE и Элементы Q
      • Предоставление котировок
    3. Нижние и верхние индексы: элементы SUB и SUP
  3. строк и абзацев
    1. Абзацы: Р элемент
    2. Управление разрывами строк
      • Принудительный разрыв строки: элемент BR
      • Запрет разрыва строки
    3. Дефис
    4. Предварительно отформатированный текст: элемент PRE
    5. Визуальное отображение пунктов
  4. Маркировка изменений документа: INS и DEL элементы

В следующих разделах обсуждаются вопросы, связанные со структурированием текста. Элементы, представляющие текст (выравнивание элементы, элементы шрифта, таблицы стилей и т. д.) обсуждаются в других разделах Технические характеристики. Информацию о персонажах можно найти в разделе набор символов документа.

Набор символов документа включает широкий разнообразие пробельных символов. Многие из них являются типографскими элементами, используемыми в некоторых приложениях для создания особых визуальных эффектов интервала. В HTML, только следующие символы определяются как пробела символов :

  • Пробел ASCII ( )
  • Вкладка ASCII ( )
  • Подача формы ASCII ( )
  • Пробел нулевой ширины (​)

Разрывы строк также являются пробелами. Примечание что хотя 
 и 
 определены в [ISO10646] как однозначно разделять строки и абзацы соответственно, эти не представляют собой разрывы строк в HTML, и эта спецификация не включает их в более общая категория пробельных символов.

Эта спецификация не указывает на поведение, рендеринг или что-то еще, пробельных символов, кроме тех, которые явно обозначены здесь как пробелы персонажи. По этой причине авторы должны использовать соответствующие элементы и стили. для достижения визуальных эффектов форматирования, которые включают пустое пространство, а не космические персонажи.

Для всех элементов HTML, кроме PRE , последовательности пробелов разделяют «слова» (здесь мы используем термин «слово» для обозначения «последовательности небелых пробелов». символов»). При форматировании текста пользовательские агенты должны идентифицировать эти слова и размещать их в соответствии с условностями конкретного письменного языка (сценарий) и целевой носитель.

Этот макет может включать пробел между словами (так называемый межсловный пробел ), но соглашения для межсловного пробела различаются от сценария к сценарию. Например, в латинице межсловный пробел обычно отображается как пробел ASCII ( ), в то время как на тайском языке это разделитель слов нулевой ширины (​). В японском и китайском языках между словами пространство обычно вообще не отображается.

Обратите внимание, что последовательность пробелов между словами в исходном документе может привести к совершенно другому отображаемому межсловному интервалу (за исключением случай элемент PRE ). В частности, пользовательские агенты должны свернуть входные последовательности пробелов при создании вывода межсловное пространство. Это можно и нужно делать даже при отсутствии языка информация (из атрибута lang , поля заголовка HTTP «Content-Language» (см. [RFC2616], раздел 14.12), настройки пользовательского агента и т. д.).

Элемент PRE используется для предварительно отформатированных текст, где пробелы являются значительными.

Во избежание проблем с правилами разрыва строки SGML и несоответствия среди существующих реализаций, авторы не должны полагаться на пользователей агенты для отображения пробела сразу после начального тега или сразу перед конечным тегом. Таким образом, авторы и, в частности, авторские инструменты, следует написать:

  
Мы предлагаем бесплатную техническую поддержку для подписчиков.

 905:00
 
 и не: 

 
  
Мы предлагаем бесплатную  техническую поддержку  для подписчиков.

 
 9.2 Структурированный текст 
 9.2.1 Элементы фразы: 
  EM  ,  СИЛЬНЫЙ ,  ДФН ,  КОД ,  САМП ,  KBD ,  VAR ,  CITE ,  ABBR  и  АКРОНИМ 
 EM  |  STRONG  |  DFN  |  КОД  |
                     САМП  |  КБД  |  ВАР  |  САЙТ  |  АББР  |  АКРОНИМ  " >


 
  Начальный тег:  требуется  , Конечный тег:  требуется  
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,  onmouseover ,  onmousemove ,  onmouseout  ,  onkeypress  ,  onkeydown ,  onkeyup  (внутренние события)
 Фразовые элементы добавляют структурную информацию к фрагментам текста. Обычно
значения элементов фразы следующие:
  Электронная почта: 
 Указывает на акцент.
  СИЛЬНЫЙ: 
 Указывает на усиление акцента.
  САЙТ: 
 Содержит цитату или ссылку на другие источники.
  ДФН: 
 Указывает, что это определяющий экземпляр заключенного термина.
  КОД: 
 Обозначает фрагмент компьютерного кода.
  САМП: 
 Обозначает образец вывода программ, скриптов и т. д.
  КБД: 
 Указывает текст, который должен быть введен пользователем.
  ВАР: 
 Указывает экземпляр переменной или аргумента программы.
  Сокращение: 
 Указывает сокращенную форму (например, WWW, HTTP, URI, Mass. и т. д.).
  СОКРАЩЕНИЕ: 
 Обозначает аббревиатуру (например, WAC, радар и т. д.).
  ЭМ  и  STRONG  используются для обозначения ударения. Остальные элементы фразы имеют
особое значение в технических документах. Эти примеры иллюстрируют некоторые
элементов фразы:
Как сказал Гарри С. Трумэн,
На этом все заканчивается.
Дополнительную информацию можно найти в [ISO-0000].
Пожалуйста, обращайтесь к следующему ссылочному номеру в будущем
переписка: 1-234-55
 905:00
 
 Представление элементов фразы зависит от пользовательского агента. В общем,
визуальные пользовательские агенты отображают текст  EM  курсивом и текст  STRONG  жирным шрифтом. Речь
пользовательские агенты синтезатора могут изменять параметры синтеза, такие как громкость,
шаг и скорость соответственно. 

 
 
Элементы ABBR  и  ACRONYM  позволяют авторам четко указать
появления аббревиатур и акронимов.
В западных языках широко используются аббревиатуры, такие как «GmbH», «NATO» и т. д.
«ФБР», а также такие аббревиатуры, как «М.», «Инк.», «и др. », «и т. д.». Оба
В китайском и японском языках используются аналогичные механизмы сокращения, при этом длинное имя
упоминается впоследствии с подмножеством ханьских символов из
оригинальное возникновение. Разметка этих конструкций предоставляет полезную информацию для
пользовательские агенты и инструменты, такие как проверка орфографии, синтезаторы речи, перевод
системы и индексаторы поисковых систем. 

 
 Содержание  ABBR  и
  Элемент ACRONYM  определяет сокращенный
само выражение, как оно обычно появляется в бегущем тексте. Название
Атрибут этих элементов может использоваться для предоставления полной или расширенной формы
выражение. 

 
 Вот несколько примеров использования
  АББР  : 
 
  <Р>
  WWW
  
     SNCF
  
  Сделатьñа
  аббр. 
 905:00
 
 Обратите внимание, что аббревиатуры и акронимы часто имеют идиосинкразический характер.
произношения. Например, в то время как "IRS" и "BBC" обычно произносятся
буква за буквой, «НАТО» и «ЮНЕСКО» произносятся фонетически. Еще другие
сокращенные формы (например, «URI» и «SQL») пишутся некоторыми людьми и
произносится как слова другими людьми. При необходимости авторы должны использовать стиль
листов для уточнения произношения сокращенной формы. 

  
 9.2.2 Цитаты: 
  БЛОКЦИТАТА  и 
Q  элементы 
 
 BLOCKQUOTE  - - (%block;|SCRIPT)+ -- длинная цитата -->
 цитировать  %URI; #ПРЕДПОЛАГАЕТСЯ -- URI исходного документа или сообщения --
  >
 Q  - - (%inline;)* -- короткая встроенная цитата -->
 цитировать  %URI; #ПРЕДПОЛАГАЕТСЯ -- URI исходного документа или сообщения --
  >
 
  Начальный тег:  требуется  , Конечный тег:  требуется  
  Определения атрибутов 
  cite  =  uri  [CT]
 Значением этого атрибута является URI, обозначающий исходный документ или
сообщение. Этот атрибут предназначен для предоставления информации об источнике из
которого цитата была заимствована.
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,   ,  onmousemove  ,  onmouseout ,  onkeypress ,  onkeydown ,  onkeyup  (внутренние события)
 Эти два элемента обозначают цитируемый текст.  BLOCKQUOTE  предназначен для длинных цитат (контент на уровне блоков), а  Q  предназначен
для коротких цитат (внутренний контент), которые не требуют разрывов абзаца.
 Этот пример форматирует отрывок из «Двух башен» Дж.Р.Р. Толкин, как
цитата.


Они шли гуськом, бежали, как гончие по сильному следу,
и нетерпеливый свет был в их глазах. Почти прямо на запад широкий
полоса марширующих орков протоптала его уродливую щель; сладкая трава
Рохана покрылись синяками и почернели, когда они проходили.


 
 Предоставление котировок  
 Визуальные пользовательские агенты обычно отображают  BLOCKQUOTE  как отступ
блокировать.
 Визуальные пользовательские агенты должны гарантировать, что содержимое элемента  Q  отображается с разделительными кавычками. Авторы не должны цитировать
метки в начале и конце содержимого элемента  Q .
 Пользовательские агенты должны отображать кавычки с учетом языка.
(см.  атрибут lang ). Многие языки используют разные стили кавычек для
внешние и внутренние (вложенные) кавычки, которые должны соблюдаться
пользовательские агенты.
 В следующем примере показаны вложенные цитаты с элементом  Q .
Джон сказал: Я видел Люси за обедом, она сказала мне,
Мэри хочет тебя
купить мороженого по дороге домой. Я думаю, что возьму
некоторые у Бена и Джерри на Глостер-роуд.
 
 Поскольку языком обеих цитат является американский английский, пользовательские агенты
должны отображать их соответствующим образом, например, с одинарными кавычками вокруг
внутренняя кавычка и двойные кавычки вокруг внешней кавычки:
  Джон сказал: «Я видел Люси за ланчем, она сказала мне: «Мэри хочет тебя».
  купить мороженого по дороге домой. Я думаю, я получу немного
  у Бена и Джерри на Глостер-роуд».
 
   Примечание.  Мы рекомендуем, чтобы реализации таблиц стилей
предоставить механизм для вставки кавычек до и после цитаты
разделенный  BLOCKQUOTE  способом, соответствующим текущему языку
контекст и степень вложенности цитат. 
  Однако, поскольку некоторые авторы использовали  BLOCKQUOTE  просто как механизм
сделать отступ текста, чтобы сохранить замысел авторов, пользовательских агентов
если , а не  вставить кавычки в значение по умолчанию
стиль. 
  Использование  BLOCKQUOTE  для отступа текста устарело в пользу таблиц стилей. 
 9.2.3 Нижние и верхние индексы: элементы 
 SUB  и  SUP 
 SUB  |  SUP  ) -- (%inline;)* -- нижний индекс, верхний индекс -->

 
  Начальный тег:  требуется  , Конечный тег:  требуется  
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,  onmouseover ,  onmousemove ,  onmouseout ,  onkeypress ,  onkeydown ,  onkeyup  (внутренние события)
 Для правильного написания многих шрифтов (например, французского) требуются надстрочные или нижние индексы. рендеринг.  Элементы SUB  и  SUP  следует использовать для разметки текста в этих
случаи.
      Н2О
      Е = мк2
      Мlle Дюпон
 
 9.3 Строки и абзацы 
 Авторы традиционно делят свои мысли и аргументы на последовательности
абзацы. На организацию информации в абзацы не влияет
как представлены абзацы: абзацы с двойным выравниванием содержат
те же мысли, что и те, что оправданы левыми.
 HTML-разметка для , определяющая  абзац, проста: элемент  P  определяет абзац.
 Визуальное представление абзацев не так просто. Ряд вопросов,
как стилистические, так и технические, необходимо обращаться:
  •  Обработка пробелов
  •  Разрыв строки и перенос слов
  •  Обоснование
  •  Дефис
  •  Соглашения о письменном языке и направленность текста
  •  Форматирование абзацев относительно окружающего контента
 Мы ответим на эти вопросы ниже. Выравнивание абзаца и плавание
объекты обсуждаются далее в этом документе.
 9.3.1 Пункты: 
 P  элемент
 P  - O (%inline;)* -- абзац -->

 
  Начальный тег:  требуется  , Конечный тег:  дополнительно  
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   выравнивание  (выравнивание)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,  onmouseover  ,  onmousemove  ,  onmouseout ,  onkeypress ,  onkeydown ,  onkeyup  (внутренние события)
  Элемент P  представляет собой абзац. Он не может содержать элементы блочного уровня (включая сам  P ).
 Мы не рекомендуем авторам использовать пустые элементы  P . Пользовательские агенты должны игнорировать
пустой  P  элемента.
 9.3.2 Линия управления
ломается 
 А  разрыв строки  определяется как возврат каретки (
),
перевод строки (
) или пара возврат каретки/перевод строки. Вся линия
перерывы составляют белое пространство.
 Для получения дополнительной информации о спецификации разрывов строк в SGML, пожалуйста,
ознакомиться с примечаниями на линии
перерывы в приложении.
 Принудительный разрыв строки: элемент 
 BR  
 BR  - O EMPTY -- принудительный разрыв строки -->

 
  Начальный тег:  требуется  , Конечный тег:  запрещено  
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   очистить  (выравнивание и плавающие объекты)
  Элемент BR  принудительно разрывает (заканчивает) текущую строку текста.
 Для визуальных пользовательских агентов атрибут  очистки  может использоваться для
определить, будет ли разметка после  BR  элемент обтекает изображения и
другие объекты плавают к левому или правому краю, или он начинается после
дно таких объектов. Более подробная информация приведена в разделе о выравнивании и плавающих объектах.
Авторам рекомендуется использовать таблицы стилей для управления обтеканием текста вокруг плавающих элементов.
изображения и другие объекты.
 В отношении двунаправленного
форматирование, элемент  BR  должен вести себя так же, как
[ISO10646] Символ LINE SEPARATOR ведет себя в двунаправленном
алгоритм.
 Запрет разрыва строки 
 Иногда авторы могут захотеть предотвратить появление разрыва строки между
два слова.   сущность (  или  ) действует как пробел
где пользовательские агенты не должны вызывать разрыв строки.
 9.3.3 Дефис 
 В HTML существует два типа дефисов: простой дефис и мягкий
дефис. Простой дефис должен интерпретироваться пользовательским агентом как еще один
персонаж. Мягкий дефис сообщает пользовательскому агенту, где находится строка.
может произойти разрыв.
 Те браузеры, которые интерпретируют мягкие дефисы, должны соблюдать следующее
семантика: если строка разрывается на мягком дефисе, символ дефиса должен быть
отображается в конце первой строки. Если линия не прерывается при мягком
дефис, пользовательский агент не должен отображать символ дефиса. Для операций таких
при поиске и сортировке мягкий дефис всегда следует игнорировать.
 В HTML простой дефис представлен символом "-" (- или
-). Мягкий дефис представлен ссылкой на сущность символа.
&застенчивый; (­ или ­)
 9.3.4 Предварительно отформатированный текст:
Элемент 
 PRE 

 PRE  - - (%inline;)* -(%pre.exclusion;) -- предварительно отформатированный текст -->

 
  Начальный тег:  требуется  , Конечный тег:  требуется  
  Определения атрибутов 
  ширина  =  номер  [CN]
  Устарело.  Это
атрибут предоставляет визуальным агентам пользователя подсказку о желаемой ширине
отформатированный блок. Пользовательский агент может использовать эту информацию для выбора
соответствующий размер шрифта или соответствующий отступ содержимого. Желаемая ширина
выражается количеством символов. Этот атрибут широко не поддерживается
В данный момент.
  Атрибуты, определенные в другом месте 
  •   идентификатор  ,  класс  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,  onmouseover ,  onmousemove ,  onmouseout ,  onkeypress ,  нажатие клавиши ,  onkeyup  (внутренние события)
  Элемент PRE  сообщает визуальным агентам пользователя, что заключенный в них текст «предварительно отформатирован». При работе с предварительно отформатированным текстом
визуальные пользовательские агенты:
  •  Может оставлять пробелы без изменений.
  •  Может отображать текст шрифтом с фиксированным шагом.
  •  Может отключить автоматический перенос слов.
  •  Не следует отключать двунаправленную обработку.
 Невизуальные пользовательские агенты не обязаны учитывать дополнительные пробелы в содержимом  Элемент PRE .
 Для получения дополнительной информации о спецификации разрывов строк в SGML, пожалуйста,
ознакомиться с примечаниями на линии
перерывы в приложении.
 Приведенный выше фрагмент DTD указывает, какие элементы могут не появляться в  PRE  декларация. Это то же самое, что и в HTML 3.2, и предназначено для сохранения
постоянный межстрочный интервал и выравнивание столбцов для текста, отображаемого с фиксированным шагом
шрифт. Авторам не рекомендуется изменять это поведение с помощью стиля.
листы.
 В следующем примере показан предварительно отформатированный стих из стихотворения Шелли . Жаворонок  :
<ПРЕД>
       Еще выше и выше
         Ты исходишь из земли
       Как облако огня;
         Синяя глубокая ты окрыляешь,
И пение все еще парит, и парение всегда поет.

 
 Вот как это обычно отображается:
       Еще выше и выше
         Ты исходишь из земли
       Как облако огня;
         Синяя глубокая ты окрыляешь,
И пение все еще парит, и парение всегда поет.
 905:00
 
   Символ горизонтальной табуляции 
 
 Символ горизонтальной табуляции (десятичная цифра 9 в [ISO10646] и
[ISO88591] ) обычно интерпретируется визуальными агентами пользователя как наименьший
ненулевое количество пробелов, необходимых для выстраивания символов вдоль позиций табуляции,
каждые 8 ​​символов. Мы настоятельно не рекомендуем использовать горизонтальные вкладки в
предварительно отформатированный текст, так как общепринятой практикой при редактировании является установка
интервал табуляции к другим значениям, что приводит к смещению документов.   

 
 9.3.5 Визуальное отображение
пункты 

 
   Примечание.  Следующий раздел является информативным
описание поведения некоторых текущих визуальных пользовательских агентов при форматировании
абзацы. Таблицы стилей позволяют лучше контролировать форматирование абзаца.  

 
 Визуальное отображение абзацев зависит от агента пользователя. Пункты
обычно отображаются заподлицо слева с рваным правым полем. Другие значения по умолчанию
подходит для сценариев с письмом справа налево. 

 
 пользовательских агента HTML традиционно отображают абзацы с пробелами.
до и после, например, 

 
  В то же время начала формироваться система нумерации,
  календарь, иероглифическое письмо и технически совершенный
  искусство, все из которых позже повлияли на другие народы.
  В рамках этой постепенной эволюции или культурного
  По мере развития доклассический горизонт был разделен на нижний,
  Средний и Верхний периоды, к которым можно добавить переходный
  или протоклассический период с некоторыми чертами, которые позже
  выделяют зарождающиеся цивилизации Мезоамерики. 
 905:00
 
 Это контрастирует со стилем, используемым в романах, где первая строка с отступом.
абзаца и использует обычный межстрочный интервал между последней строкой
текущий абзац и первая строка следующего, например, 

 
     В это же время начала формироваться система
  нумерация, календарь, иероглифическое письмо и технически
  передовое искусство, все из которых позже повлияли на другие народы.
     В рамках этой постепенной эволюции или культурного
  По мере развития доклассический горизонт был разделен на нижний,
  Средний и Верхний периоды, к которым можно добавить переходный
  или протоклассический период с некоторыми чертами, которые позже
  выделяют зарождающиеся цивилизации Мезоамерики.
 905:00
 
 Следуя прецеденту, установленному браузером NCSA Mosaic в 1993 году, пользовательские агенты
как правило, не оправдывают оба поля, отчасти потому, что это сложно сделать
эффективно без сложных процедур расстановки переносов. Появление стиля
листов, а шрифты со сглаживанием и субпиксельным позиционированием обещают предложить
более богатый выбор для авторов HTML, чем это было возможно ранее.  

 
 Таблицы стилей обеспечивают широкие возможности управления размером и стилем шрифта,
поля, пробел перед и после абзаца, отступ первой строки,
обоснование и многие другие детали. Таблица стилей по умолчанию пользовательского агента
рендеры 
Элементы P  в знакомой форме, как показано выше. Можно было бы, в
принцип, переопределите это, чтобы отображать абзацы без разрывов, которые
условно выделяют последовательные абзацы. В общем, поскольку это может
запутать читателей, мы не одобряем эту практику. 

 
 По соглашению визуальные пользовательские агенты HTML переносят текст
линии, чтобы они соответствовали доступным полям. Алгоритмы упаковки
зависит от форматируемого скрипта. 

 
 Например, в западных сценариях текст должен переноситься только на пробел.
Ранние пользовательские агенты неправильно переносили строки сразу после начального тега или просто
перед конечным тегом элемента, что приводило к оборванной пунктуации. За
например, рассмотрим это предложение: 

 
   Статуя Киватеуса, покровителя . ..
 
 Перенос строки непосредственно перед конечным тегом элемента  A  приводит к тому, что запятая
мель в начале следующей строки:
  Статуя Сиуатеуса
  , кто покровитель...
 
 Это ошибка, так как в этой точке в
наценка.
 9.4 Маркировка изменений документа:
Элементы INS и DEL 

 ИНС  |  DEL  ) -- (%flow;)* -- вставленный текст, удаленный текст -->
 цитировать  %URI; #ПРЕДПОЛАГАЕТСЯ -- информация о причине изменения --
    дата-время  % Дата-время; #ПРЕДПОЛАГАЕТСЯ -- дата и время изменения --
  >
 
  Начальный тег:  требуется  , Конечный тег:  требуется  
  Определения атрибутов 
  ссылка  =  uri  [CT]
 Значением этого атрибута является URI, обозначающий исходный документ или
сообщение. Этот атрибут предназначен для указания на информацию, объясняющую, почему
документ был изменен.
  дата-время  =  дата-время  [CS]
 Значение этого атрибута указывает дату и
время, когда было внесено изменение.
  Атрибуты, определенные в другом месте 
  •   id  ,  class  (идентификаторы всего документа)
  •   язык  (язык
информация),  дир  (текст
направление)
  •   заголовок  (заголовок элемента)
  •   стиль  (встроенный
информация о стиле)
  •   onclick ,  ondblclick ,  onmousedown ,  onmouseup ,  onmouseover ,  onmousemove ,  onmouseout ,  onkeypress ,  нажатие клавиши ,  onkeyup  (внутренние события)
  INS  и  DEL  используются для разметки разделов документа, которые имеют
были вставлены или удалены по отношению к другому
версия документа (например, в законопроекте, где законодателям необходимо просмотреть
перемены).
 Эти два элемента необычны для HTML тем, что они могут служить либо
блочные или встроенные элементы (но не оба). Они могут содержать один или несколько
слова внутри абзаца или содержат один или несколько элементов блочного уровня, таких как
абзацы, списки и таблицы.
 Этот пример может быть из законопроекта об изменении законодательства на сколько
помощников шерифа округа может нанять от 3 до 5.
<Р>
  Шериф может нанять 35 помощников.


 
  Элементы INS  и  DEL  не должны содержать содержимое на уровне блоков, когда они
элементы ведут себя как встроенные элементы.
 НЕЗАКОННЫЙ ПРИМЕР: 
 Следующий код является недопустимым HTML.
<Р>

  ...контент на уровне блоков...  



 
 Пользовательские агенты должны отображать вставленный и удаленный текст таким образом, чтобы
изменение очевидно. Например, вставленный текст может отображаться специальным шрифтом,
удаленный текст может вообще не отображаться или отображаться зачеркнутым или с
специальная маркировка и др.
 Оба следующих примера соответствуют 5 ноября 1994 г., 8:15:30,
Восточное стандартное время США.
     1994-11-05T13:15:30Z
     1994-11-05T08:15:30-05:00
 
 Используется с  INS , это дает:

Кроме того, последние данные отдела маркетинга
предполагают, что такая практика набирает обороты.

 
 Документ "http://www.foo.org/mydoc/comments.html" будет содержать комментарии
о том, почему информация была вставлена ​​в документ.
 Авторы также могут комментировать вставленный или удаленный текст с помощью  атрибут title  для
 Элементы  INS  и  DEL . Пользовательские агенты могут представлять
эту информацию пользователю (например, в виде всплывающей заметки). Например:
 ">
Кроме того, последние данные отдела маркетинга
предполагают, что такая практика набирает обороты.

 
 предыдущий   следующий
содержимое   элементы   атрибуты
индекс
 Код в тексте | Руководство по стилю документации для разработчиков Google 
  Ключевой момент:  Используйте кодовый шрифт для отображаемого кода
в текст.
 В обычных текстовых предложениях (в отличие, скажем, от образцов кода),
 используйте кодовый шрифт, чтобы отметить большинство вещей, которые имеют какое-либо отношение к коду.
  •  В HTML используйте элемент   .
  •  В Markdown используйте обратные кавычки (  `  ).
 Для получения информации о выборе HTML или Markdown см.
 Уценка против HTML.
 На этой странице объясняется, как форматировать код в обычных текстовых предложениях. Для получения дополнительной информации о
 форматирование и объяснение заполнителей, синтаксиса командной строки и примеры кода см. ресурсы:
  •  Форматирование заполнителей
  •  Документирование синтаксиса командной строки
  •  Образцы кода
  •  Форматирование заголовка или названия
  •  Текст кода перед двоеточием
 Некоторые элементы, которые нужно поместить в кодовый шрифт 
 Следующий список включает элементы, которые должны быть выделены кодовым шрифтом, но не
исчерпывающий список.
  •  Имена и значения атрибутов
  •  Имена классов
  •  Вывод команды (например,  сервер имен 169.254.169.254  )
  •  Имена утилит командной строки, например  gcloud  ,  gsutil ,  kubectl  и  bq 
  •  Типы данных
  •  Определенные (постоянные) значения для элемента или атрибута
  •  ДНС
 типы записей
  •  Enum (перечислитель) имен
  •  Имена переменных среды
  •  Имена элементов (XML и HTML)
     Поместите угловые скобки (  <>  ) вокруг имени элемента; вам, возможно, придется
 экранируйте угловые скобки, чтобы они отображались в документе.
  •  Имена файлов, расширения файлов (если используются),
 и пути
  •  Папки и каталоги
  •  HTTP-команд
  •  Коды состояния HTTP
  •  Значения типа содержимого HTTP
  •  Имена ролей IAM (например,  ролей/storage.admin  )
  •  Ключевые слова языка
  •  Имена методов и функций
  •  Псевдонимы пространств имен
  •  Переменные-заполнители
  •  Имена и значения параметров запроса
  •  Строки (например, URL-адреса или имена доменов), которые используются в командах и коде:
     Рекомендуется: в IAM условие может
 указать страницу, к которой могут получить доступ только администраторы отдела кадров, например,  https://hr.example.com  .
     Рекомендуется:  logID  поле включает домен  corpaudits. example.com  .
  •  Ввод текста (например,  my-instance  )
  •  Элементы пользовательского интерфейса, отображаемые на основе ранее введенных
 ввод текста
     Например, если пользователю было указано в процедуре ввести имя экземпляра как  my-instance  , когда вы говорите им щелкнуть имя экземпляра, использовать кодовый шрифт и
 полужирный:  Нажмите   мой экземпляр   . 
 Как правило, не заключайте код в кавычки, если только кавычки не
являются частью кода.
 Элементы для ввода обычным (некодовым) шрифтом 
 Следующий список включает элементы, которые не должны быть выделены кодовым шрифтом, но
не исчерпывающий список.
  •  Адреса электронной почты.
  •  доменных имен.
  •  URL-адреса, которым читатель должен следовать в браузере.
     Однако обычно лучше отформатировать URL-адрес как ссылку и использовать описательный текст ссылки.
 вместо того, чтобы показывать сам URL. Для получения дополнительной информации см.
 Текст ссылки.
  •  Наименования продукции, услуг и организаций.
     Часто имена утилит командной строки пишутся так же, как и сами программы.
проект или продукт, с которым они связаны, с различиями только в
капитализация. В таких случаях используйте кодовый шрифт для команды и обычный шрифт.
для названия проекта или продукта.
     Рекомендуется:
    •  Вызвать компилятор GCC 8.3, используя  gcc  для программ на C или  g++  для программ на C++.
    •  Чтобы отправить файл по FTP с IPv6, используйте  ftp -6  .
    •  Параметры команды  curl  объясняются на
 Сайт проекта curl.
    •  Программа  apt  включает команды из  apt-get  и  программ apt-cache  для работы с APT-пакетами.
 Имена методов 
 Когда вы ссылаетесь на имя метода в тексте, опускайте имя класса, за исключением случаев, когда
включение этого предотвратило бы двусмысленность.
 Рекомендуется: чтобы найти зебру.
 метаданные, вызовите его метод  get() .
 Не рекомендуется: для извлечения зебры
 метаданные, вызовите его метод  animal.get() .
 Поместите пустую пару круглых скобок после имени метода, чтобы указать, что это метод.
 Чтобы обратиться к одному коду состояния, используйте следующее форматирование и
формулировка:
 и код состояния HTTP  400 Bad Request 
 В частности, назовите это кодом состояния   вместо ответа . код  или  код ошибки  , и введите номер и имя шрифтом кода.
Если  HTTP  неявно вытекает из контекста, его можно не указывать.
 Для обозначения ряда кодов используйте следующую форму:
 HTTP  2xx  или  400  код состояния
 В частности, используйте   N  xx  (с определенной цифрой вместо  N  ) для обозначения  чего-либо в  N  00-  N  99
диапазон  и введите номер кода состояния в кодовом шрифте, даже если вы уходите
имя кода.
 Если вы предпочитаете указывать точный диапазон, вы можете сделать это:
 код состояния HTTP в  200  -  299  диапазон
 Здесь тоже поместите цифры кодовым шрифтом.
 Руководства по стилю кода 
 На GitHub доступны следующие руководства по стилям кодирования Google:
  •  Руководство по стилю C++.
  •  Руководство по стилю HTML/CSS.
  •  Руководство по стилю Java.
  •  Руководство по стилю JavaScript.
  •  Руководство по стилю Python
  •  Полный список руководств по стилю программирования Google
 Некоторые проекты с открытым исходным кодом имеют собственные руководства по стилю. За
Например, код Java в проекте Android с открытым исходным кодом соответствует коду Java AOSP.
Руководство по стилю для авторов.
 Грамматическая обработка кодовых элементов 
 Как правило, не используйте такие элементы кода, как ключевые слова и имена файлов, как если бы они
английские глаголы или существительные. Не изменяйте имя элемента кода, например, чтобы сделать его
множественное или притяжательное. Вместо этого включите существительное после имени элемента кода и
склонять это существительное.
 Рекомендуемый Не рекомендуется
 Значение константы  ADDRESS  определено в  файл settings. h .  Значение адреса  определяется в  settings.h  .
 Чтобы добавить данные, отправьте запрос  POST .  ПОЧТ  данные.
 Чтобы получить данные, отправьте запрос  GET . Получить информацию с помощью  GET  обработки данных.
 Вы не можете закрыть файл перед его открытием.
 Вы не можете вызвать метод  close()  для файла до вызова  открыть()  .
  Close()  Чтобы открыть файл, необходимо, чтобы вы сначала его отредактировали.
 Принимает массив расширенных кодовых точек ASCII (массив  значений INT64 )
 и возвращает  BYTES  значений.
 Для аргументов  STRING  возвращает исходную строку со всеми буквами
 символы в верхнем регистре.
 Принимает массив расширенных кодовых точек ASCII (МАССИВ INT64) и возвращает БАЙТЫ.
  Исключение:  При документировании API Java обычно пропускаются слова
как  объект  или  экземпляр  и вместо этого использовать имя класса как
существительное:  хранить  MyClass , которые вы получили от  ClassFactory   . Если вам нужно поставить такие существительные во множественное число, то добавьте  объект  или экземпляр   :  сохраните  объектов MyClass , которые вы получили
из  ClassFactory  экземпляров  .
 Когда вы пишете комментарии к коду, вы превращаете их в сгенерированные ссылки
документация, ссылка на все элементы Android API, такие как классы, методы,
константы и атрибуты XML. Используйте кодовый шрифт и обычный HTML    элементов для ссылки на этот справочный материал.
 Ссылка  AndroidManifest.xml  элементов и атрибутов на API
страницы руководства. Свяжите атрибут определенного виджета или макета с его Javadoc
в справочной записи API виджета или макета.
 Рекомендуется:
данные
 
 Очень распространенные классы, такие как  Activity  и  Intent  не нужно связываться каждый раз. Если вы используете термин как понятие, а не как
class, то не помещайте его в кодовый шрифт и не используйте его с заглавной буквы. Вот некоторые
объекты, для которых не всегда требуются ссылки Javadoc или капитализация:
  •  деятельность, деятельность
  •  служба
  •  фрагмент
  •  просмотр
  •  погрузчик
  •  панель действий
  •  намерение
  •  контент-провайдер
  •  широковещательный приемник
  •  виджет приложения
 Если вы используете один из этих терминов в контексте ссылки на фактический
Например, используйте формальное имя класса и ссылку на его справочную страницу. Вот два
примеры:
 Рекомендуется: действие   — это компонент приложения, предоставляющий экран, с которым пользователи могут взаимодействовать...
 Рекомендуется: пользовательский интерфейс для
активность обеспечивается иерархией представлений — объектов, производных от  представления  учебный класс.
 Для ссылки на класс или метод:
  •  Чтобы создать ссылку на класс, используйте имя класса в качестве текста ссылки, например:
     TextView 
  •  Для ссылки на метод используйте имя метода в качестве идентификатора фрагмента. Если
вы ссылаетесь на статический метод, также укажите имя класса в ссылке
текст. Если вам нужно различать перегруженные версии определенного
метод, рассмотрите возможность отображения полной подписи, например:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *