Выделение текста жирным в html: Как выделить текст жирным в html — Независимое театральное объединение "Зрительские симпатии"

Содержание

Основные HTML теги форматирования текста — выделение текста жирным и курсивом; параметры размера, цвета и шрифта; абзац и теги заголовков

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

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

Содержание

Правила и порядок написания тегов
Выделение текста жирным и курсивом — теги , , и
Теги выделения текста чертой — , <s> и <strike>
Тег и атрибуты — параметры шрифта текста
Блочные элементы оформления текста — заголовки <h2>-<h6>, абзац

Правила и порядок написания тегов

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

 Выделенный фрагмент 

Когда браузер обработает этот фрагмент, то вы увидите вот такой текст: Выделенный фрагмент. Кстати, в RSS ленте все теги не отображаются (что такое RSS лента и новостная рассылка).

Главное при написании тегов — не забывайте их закрывать. Иначе весь текст на странице будет выделен жирным (в примере с тегом ). Но бывают такие случаи, когда нужно выделить определенный фрагмент и жирным и курсивом одновременно. Но тега, выполняющего это действие, не существует. Выход из этой ситуации один: использовать два тега одновременно. В каком порядке их использовать значения не имеет. Поэтому, написав текст с тегами так:

 Выделенный фрагмент

или вот так:

 Выделенный фрагмент

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

Выделение текста жирным и курсивом — теги , , и

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

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

Текст в тегах strong

Текст в тегах b

А вот как выглядят две данные строчки в исходном коде страницы:

Текст в тегах strong 

Текст в тегах b 

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

Текст в тегах em

Текст в тегах I

А вот исходный код:

Текст в тегах em 

Текст в тегах I 

Итак, рассмотренные теги выделения жирным и курсивом фактически не отличаются, но зачем же тогда нам, например, тег если есть ? Ведь последний содержит всего один символ (не считая скобок) и, следовательно, легче в написании. А все дело в том, что теги  и  влияют на внутреннюю оптимизацию сайта. Если вы будете окружать этими тегами ключевые слова, то это благоприятно скажется на продвижении сайта. Главное не переусердствовать — максимум в тексте должно быть 5% жирного текста в теге , и столько же и курсива в теге .

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

Теги выделения текста чертой — , <s> и <strike>

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

Еще два схожих по назначению тега — <s> и <strike>. Оба выполняют функцию ~~зачеркивания~~ текста. Использовать этот тег можно в любых ситуациях: если вы обновляете документ (а точнее его часть), то можно перечеркнуть старое и добавить новое; если вы собираетесь написать нечто, отходящее от темы материала; что-то не соответствующее морально-этическим нормам.

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

Тег и атрибуты — параметры шрифта текста

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

face — сам шрифт. Например, Arial, Courier или Verdana. Можно перечислить несколько, т.к. не у всех пользователей имеется обширный набор шрифтов, а написав несколько в атрибуте face, браузер сможет выбрать, какой использовать, а точнее — какой присутствует в системе;
size — атрибут, указывающий размер текста. Может быть выражен как в условных единицах, так и в пикселях;
color — цвет текста. Данный атрибут можно использовать как в HTML-кодах цветов, так и в словесных. Первые имеют вид #FFFFFF (где F — любая цифра или буква от A до F), а вторые записываются простыми словами (например, red — красный).

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

</pre>

Этот текст имеет размер 6px

<pre></pre>

Этот текст красного цвета

<pre></pre>

Этот текст имеет шрифт Arial

<pre></pre>

Этот текст красного цвета и размера 5px

Блочные элементы оформления текста — заголовки <h2>-<h6>, абзац

Напоследок мы рассмотрим блочные элементы, которые используются практически в каждом документе. Это теги заголовков и абзаца. Рассмотрим первое. Заголовки бывают 6-ти видов и каждый имеет свой тег. Каждый вид носит лишь свой порядковый номер и записывается с помощью тегов <h2>, <h3>,…, <h6>.

Вот как выглядят все заголовки в обработанном виде:

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

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

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

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

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

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

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

Чтобы создать самый большой заголовок применяется тег <h2></h2>, самый маленький <H6></H6>. Цифры между 1 и 6 = 2,3,4,5= создают заголовок промежуточных размеров.
Но имейте ввиду,что при применении тега <H> текст будет выглядеть как абзац и будет начинаться с новой строки а так же с новой строки будет начинаться и следующий за ним текст.

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

Что бы установить цвет шрифта надо в теге задать цвет шрифта: color=»#?» Цвет шрифта устанавливается в формате цветов HTML, к примеру «#FFFFFF». Можно объединить цвет и размер шрифта в одном теге . Запись этого параметра выглядит так: текст.

Если вы хотите установить размер шрифта для всей страницы то пишем <BASEFONT SIZE=?> со значениями ?= от 1 до 7; по умолчанию 3. Выбор шрифта=, самые распространенные Arial,Tahoma,Verdana,Times New Roman,Georgia.

Расположить текст посередине можно с помощью тега
<CENTER></CENTER> Расположить слева=<LEFT> справа=<RIGHT>

Также применяются следующие теги:

Параграф =
Выравнивание = значения=
left — слева,
right — справа,
center — по центру,
jastify — по ширине.

Новая строка = ( перевод строки)
Убрать выравнивание =  
Горизонтальный разделитель = <HR>

Если вы хотите сделать пробел нужной длины то вставьте в текст символ
  нужное количество раз.
Выделение цитат курсивом = <CITE></CITE>
Выделение текста подчеркиванием =<ins></ins>-предпочтительнее,
и 
Нижний индекс= ,запись=H2SO4
Верхний индекс,запись=m3

Пример написания шрифта
Посмотрите этот код
Пример написания <ins>шрифта</ins>

[HTML] — Как сделать текст жирным в HTML — SheCodes Athena —

Узнайте, как использовать теги HTML, чтобы текст отображался полужирным шрифтом.

👩‍💻 Технический вопрос

Спросил 15 дней назад в HTML Елена

как выделить жирным шрифтом?

HTML жирный текст сильный тег форматирование

Дополнительные вопросы по кодированию в HTML

👩‍💻 Технический вопрос

Спросил 7 дней назад в HTML от Mbasa

как написать степень в html

HTML символ градуса организация

👩‍💻 Инструкции по коду HTML, CSS и JavaScript

Спросил 8 дней назад в HTML by Shideh

Карта Google

API Карт Google JavaScript CSS HTML

👩‍💻 Технический вопрос

Спросил 8 дней назад в HTML by Briana

Когда используется тег

HTML связь внешние файлы CSS JavaScript файлы значков

👩‍💻 Инструкции по коду HTML, CSS и JavaScript

Спросил 8 дней назад в HTML by Chelsey

помогите мне придумать строку меню, которая проходит вверху страницы и включает в себя «Исследования», «Люди», «Публикации», «Ресурсы» и «Стажировки»

HTML CSS строка меню навигация активный

👩‍💻 Технический вопрос

Спросил 8 дней назад в HTML от Tanja

Как я могу центрировать кнопку

HTML CSS центр кнопка выравнивание

👩‍💻 Технический вопрос

Спросил 8 дней назад в HTML Алексия

как подчеркнуть заголовок в html

HTML подчеркнуть заголовок тег

👩‍💻 Технический вопрос

Спросил 9 дней назад в HTML by Jenny

как сделать, чтобы ссылка открывалась в новой вкладке

HTML связь гиперссылка цель новая вкладка

👩‍💻 Инструкции по коду HTML, CSS и JavaScript

Спросил 9 дней назад в HTML Наталья

  как кодировать двуязычный сайт с большим количеством страниц

HTML CSS JavaScript двуязычный Веб-сайт стр.

Основные HTML теги форматирования текста — выделение текста жирным и курсивом; параметры размера, цвета и шрифта; абзац и теги заголовков

Правила и порядок написания тегов

Выделение текста жирным и курсивом — теги <strong>, <B>, <em> и <I>

Теги выделения текста чертой — <u>, <s> и <strike>

Тег <font> и атрибуты — параметры шрифта текста

Блочные элементы оформления текста — заголовки <h2>-<h6>, абзац <p>

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

[HTML] — Как сделать текст жирным в HTML — SheCodes Athena —

👩‍💻 Технический вопрос

👩‍💻 Технический вопрос

👩‍💻 Инструкции по коду HTML, CSS и JavaScript

👩‍💻 Технический вопрос

👩‍💻 Инструкции по коду HTML, CSS и JavaScript

👩‍💻 Технический вопрос

👩‍💻 Технический вопрос

👩‍💻 Технический вопрос

Как использовать тег

Изучение различных способов оформления полужирного текста с помощью CSS

Советы по выделению полужирного текста на веб-странице

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