Рабочие листы
к вашим урокам
Скачать
1 слайд
HTML: Теги для текста
В создании презентации использованы контент сайта puzzleweb.ru
2 слайд
Форматирование текста
Этот пример демонстрирует, как вы можете отредактировать текст в HTML документе, используя специальные теги:
<html>
<body>
<p><b>Текст</b></p>
<p><strong>Текст</strong></p>
3 слайд
Форматирование текста
<p><em>Текст</em></p>
<p><i>Текст</i></p>
<p><small>Текст</small></p>
<p>Это<sub> нижний индекс</sub> и <sup>верхний индекс</sup></p>
</body>
</html>
4 слайд
Тег <pre>
Тег <pre> позволяет выделить часть исходного текста, которая должна отобразиться браузером в первоначальном виде, то есть теми же символами и с тем же количеством пробелов и разрывов строк. Весь текст, заключенный между открывающим тегом <pre> и закрывающим </pre>, будет отображаться моноширинным шрифтом:
<html>
<body>
<pre>
Он сохраняет авторское форматирование текста
5 слайд
Тег <pre>
(оставляет без изменений)
и делает шрифт моноширинным
</pre>
</body>
</html>
6 слайд
Теги для отображения кода
Пример, показанный ниже, демонстрирует разницу вывода содержимого тегов на экран:
<html>
<body>
<p><code>Программный код</code>
<kbd>Ввод с клавиатуры</kbd>
<samp>Образец кода</samp>
7 слайд
Теги для отображения кода
<var>Выделение переменной</var>
</p>
<p>
Эти теги обычно используются для того, чтобы показать на странице программный код
</p>
</body>
</html>
8 слайд
Тег <address>
Адрес является распространенным элементом многих HTML-документов, для выделения адреса на странице существует специальный тег <address>, отделяющий текст, заключенный в него, от всего остального содержимого.
Чаще всего он используется для выделения контактной информации, например адреса электронной почты или способа связи с автором/владельцем документа, статьи или сайта:
<html>
<body>
<p>Вы можете найти меня на моем сайте</p>
9 слайд
Тег <address>
<address>
<a href="www.mysite.ru">Мой сайт для связи</a>
</address>
</body>
</html>
10 слайд
Аббревиатуры
Пример демонстрирует, как можно написать аббревиатуру или сокращение:
<html>
<body>
<p><abbr title="Неопознанный Летающий Объект">НЛО</abbr>
Атрибут title нужен для всплывающей подсказки, она появляется
при наведении курсора на аббревиатуру.
</p>
</body>
</html>
11 слайд
Направление текста
Пример демонстрирует, как можно изменить направление текста:
<html>
<body>
<p>
Тег bdo определяет направление текста - слева направо и наоборот.
<bdo dir="rtl">
Это наш текст
</bdo>
</p>
</body>
</html>
12 слайд
Цитаты
В HTML есть два тега для выделения цитат в тексте - <q> и <blockquote>. Тег <q> является строчным элементом и предназначен для выделения коротких цитат непосредственно в тексте абзаца. Текст, размещенный внутри элемента <q>, по умолчанию большинством браузеров отображается в двойных кавычках.
В отличие от тега <q>, тег <blockquote> является блочным элементом, он предназначен для выделения длинных цитат, которые по объему больше похожи на целые абзацы. В большинстве браузеров текст элемента <blockquote> будет отображаться с небольшим отступом вправо и иметь разрывы строки до и после себя:
13 слайд
<html>
<body>
<p>Длинная цитата:</p>
<blockquote>
Это очень длинная цитата.Это очень длинная цитата.Это очень длинная цитата.
Это очень длинная цитата.Это очень длинная цитата.Это очень длинная цитата.
</blockquote>
14 слайд
<p><b>Для длинных цитат браузер вставляет отступы со всех сторон. </b>
Короткая цитата:
<q>Это короткая цитата.</q>
<b>Короткие цитаты заключаются в двойные кавычки.</b>
</p>
</body>
</html>
15 слайд
Удаленный и вставленный текст
Пример демонстрирует, как можно в документе пометить текст, который был удален (помечается как перечеркнутый) или вставлен (помечается как подчеркнутый):
<html>
<body>
<p>
Содержимое тега del, большинство браузеров отображает <del>перечеркнутым</del>, а
16 слайд
Удаленный и вставленный текст
содержимое тега ins - <ins>подчеркнутым</ins>
</p>
</body>
</html>
Попробовать »
Примечание: также подчёркивание и перечёркивание можно задать с помощью CSS свойства text-decoration.
Рабочие листы
к вашим урокам
Скачать
6 663 276 материалов в базе
Настоящий материал опубликован пользователем Шайхетдинов Вадим Шамситдинович. Инфоурок является информационным посредником и предоставляет пользователям возможность размещать на сайте методические материалы. Всю ответственность за опубликованные материалы, содержащиеся в них сведения, а также за соблюдение авторских прав несут пользователи, загрузившие материал на сайт
Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете оставить жалобу на материал.
Удалить материалВаша скидка на курсы
40%Курс профессиональной переподготовки
500/1000 ч.
Курс повышения квалификации
36/72 ч.
Курс повышения квалификации
36 ч. — 180 ч.
Курс профессиональной переподготовки
300/600 ч.
Мини-курс
3 ч.
Мини-курс
6 ч.
Оставьте свой комментарий
Авторизуйтесь, чтобы задавать вопросы.