Урок 4-й. Работа с текстом.
С этого урока мы наконец то перейдем к работе с "телом" страницы, а именно научимся вставлять текст, менять его размер шрифт.
Действовать мы начнем между тэгами <body> и </body>. В предыдущих уроках я уже говорил что туда можно вставить любой текст, например так:
<html>
<head>
<title> Самый лучший сайт </title>
<link rel="short icon" href="icon.ico">
<base target="_self">
</head>
<body>
Привет! это мой сайт!
</body>
</html>
Еще я говорил, что не имеет значения как писать код в строчку или вертикально, браузеры игнорируют переносы строк и в связи с этим появляется проблема переноса строк в написании текста, то есть если вы напишите так:
<body>
Привет!
Это мой сайт!
</body>
То текст все равно будет написан в строчку вот так:
Привет! Это мой сайт!
Специально для этого есть тэг <br> ,он не требует второго закрывающего тэга и работает как кнопка “ентер” при написании текста. Для того что бы текст выглядел вот так:
Привет!
Это мой сайт!
Используется вот такой код:
<body>
Привет! <br>
Это мой сайт!
</body>
С переносом строк закончили теперь поговорим о размере букв. Для этого существует несколько тэгов. Начнем мы с самого простого:
<small></small>
и
<big></big>
Не нужны огромные познания английского, что бы понять что они делают, но все же:
<small></small> -уменьшает текст
а
<big></big> - увеличивает
Сразу покажу на примере:
<body>
<small>Привет!</small><br>
<big>Это мой сайт!</big>
</body>
Кстати делать вот так:
<small><big>Привет!</big> </small>
Нет смысла.
Но эти тэги используют редко, потому что есть более удобные:
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
Тэг <h1></h1> соответствует самому большому шрифту, а <h6></h6> самому маленькому.
Пример:
<body>
<h1>Привет!</h1>
<h6>Это мой сайт!</h6>
</body>
Обратите внимание на то, что я не использовал тэг <br> для переноса строки. Дело в том, что тэги <hX> предназначены для заголовков и после этого тэга автоматически производится перенос строки.
Но как быть, если надо выделить слово посреди текста? Для этого существует тэг:
<font></fond>
Этот тэг имеет несколько функций, о которых я расскажу позже. Для того что бы менять размер шрифта используется следующий параметр тэга:
size
значение которого может быть от 0 до 7. Сразу привожу пример:
<body>
<font size="0">Привет!</font><br>
<font size="7">Это мой сайт!</font>
</body>
Теперь расскажу про индексы верхний и нижний.
<sup></sup> -верхний индекс
<sub></sub> - нижний индекс
Думаю все понятно вот пример:
<body>
<sup>верхний индекс</sup>
<sub>нижний индекс</sub>
</body>
Далее дам несколько тэгов выделяющие текст:
<b> </b> - полужирный
<i> </i> - курсив
<tt> </tt> - моноширный
<u> </u> - подчеркнутый
<strike> </strike> - перечеркнутый
<s> </s> - тоже перечеркнутый
<pre> </pre> - форматированный (этот тэг еще совершает перенос строк до и после себя)
Пример:
<body>
обычный<br>
<b>полужирный</b><br>
<i>курсив</i><br>
<tt>моноширный</tt><br>
<u>подчеркнутый</u><br>
<strike>перечеркнутый</strike><br>
<s>перечеркнутый</s>
<pre>форматированный</pre>
</body>
И под конец расскажу про еще один параметр тэга <font>:
face -устанавливает шрифт текста
пример:
<font face="arial">текст</font>
Вот список шрифтов которые есть у каждого: Times, Garamond, Times New Roman, Arial, Helvetica, Courier, Verdana, Tahoma, Cosmic Sans. Их можно использовать, не опасаясь что этого шрифта не окажется у кого либо. Можно прописать несколько шрифтов:
<font face="arial, garamond">текст</font>
Таким образом, если нет первого шрифта то текст будет отображаться вторым.
А о том, как расположить текст в нужном месте я расскажу на следующем уроке.
Боьлше информаций вы можете узнать на моем сайте, просто нажмите на сcылку - Основы HTML