Форматирование текста средствами html
Исходное назначение HTML заключалось в представлении текстовой информации. Как мы уже говорили, текст документа в HTML обычно помещается между тегами <BODY> и </BODY>. Например, предположим, что мы создаем страницу аутентификации пользователей. Текст HTML на ней может выглядеть следующим образом (обратите также внимание на синтаксис комментариев HTML):
<BOВY>
<!- Приглашение пользователю к аутентификации ->
The Cars Login Page
</BODY>
В этом примере к нашему тексту не были применены какие-либо теги. Встречаясь с таким текстом, web-браузер выводит его в своем окне так, как он был записан. Если мы изменим текст документа следующим образом:
<BODY>
<!- Приглашение пользователю к аутентификации ->
The Cars Login Page
Please enter your user name and password. </BODY>
то браузер и не подумает добавить ожидаемый переход на новую строку (рис. 14.5).
Рис. 14.5. Для текстовой информации без тегов символы начала новых строк учитываться не будут
Чтобы начать новый абзац, необходимо выделить текст в этом абзаце при помощи тегов <Р> и </Р>, например, так:
<BODY>
<!- Приглашение пользователю к аутентификации ->
The Cars Login Page
<P>Please enter your user name and password.</P> </BODY>
Теперь в окне браузера все выглядит по-другому (рис. 14.6).
Рис. 14.6. Тег <Р> означает начало нового абзаца
Можно и не начинать новый абзац, а просто добавить теги начала новой строки <BR> и <./BR>
<BODY>
<!- Приглашение пользователю к аутентификации ->
The Cars Login Page
<BR>Please enter your user name and password.</BR>
</BOOY>
В этом случае браузер отобразит наш текст несколько иначе (рис. 14.7).
Рис. 14.7. Тег <BR> означает переход на новую строку
В HTML предусмотрены средства для выделения участков текста полужирным шрифтом и курсивом. Для этого предусмотрены теги <В> </В> и <I> </I> соответственно:
<BODY>
<!- Приглашение пользователю к аутентификации ->
<В> The Cars Login Page </B>
<BR>Please enter your <I>user name</I> and <I>password</I>.</BR> </BODY>
Результат представлен на рис. 14.8.
Рис. 14.8. Выделение текста полужирным и курсивным начертаниями
Заголовки html
Ещё один вид тегов для форматирования текста, который мы рассмотрим, — это теги заголовков HTML. Они выглядят как <Н1>, <Н2>, <НЗ>, <Н4>, <Н5> и <Н6> и применяются для изменения размера выделенного ими текста. Наибольший относительный размер текста обеспечивает тег <Н1> (заголовок первого уровня). Вот пример:
<BODY>
<!- Приглашение пользователю к аутентификации ->
<Н1> The Cars Login Page </Hl>
<BR>
<H3>Please enter your <I>user name</I> and <I>password</I>.</H3></BR>
</BODY>
Для того чтобы блок текста был выровнен посередине страницы, можно использовать тег <CENTER>:
<BOOY>
<!- Приглашение пользователю к аутентификации ->
<CENTER>
<Н1> The Cars Login Page </Hl>
<BR><H3>Please enter your <I>user name</I> and <I>password</I>.</H1></BR>
</CENTER> </BOOY>
To, как теперь выглядит наша страница, показано на рис. 14.9.
Рис. 14.9. Применение тегов заголовков и выравнивания
Html-редактор Visual Studio.Net
Пока у нас получается очень простая, если не сказать примитивная, страница. Давайте мы ее немного оживим. Для этого нам потребуется добавить дополнительные теги HTML. Проще всего сделать это при помощи встроенных средств Visual Studio.NET.
Начнем с тех средств, которые применяются для управления отображением всего документа. Для этого выберем объект Document и откроем его свойства (рис. 14.10).
Рис.14.10. Редактирование документа при помощи графических средств Visual Studio
Например, если мы изменим значение свойства bgColor (background color — цвет фона), то в нашем документе HTML автоматически появится новый тег (рис. 14.11).
Рис. 14.11. Изменения, вносимые при помощи графических средств, сразу же появляются в коде HTML
В Visual Studio.NET также предусмотрена панель форматирования HTML (Formatting). С ее помощью можно управлять представлением блоков текста, выбирая для них цвет, шрифт, уровень заголовка, применение разметки списков и т. п. (рис. 14.12).
Рис. 14.12. Панель форматирования HTML
При помощи графических средств Visual Studio.NET мы можем оформить нашу страницу — весь необходимый для этого код HTML будет сгенерирован автоматически. Эти средства позволяют сэкономить много времени, однако web-разработчику часто приходится создавать весь код для страницы HTML вручную.