Войти или зарегистрироваться

Главная Новости Блоги Скачать Социальная сеть Форум




Урок 6. Заголовки и размер шрифта html
 

Продолжаем изучение html, на этот раз остановимся на тегах <font> .. </font> и заголовках, а так же научимся задавать размер шрифта в тексте и заголовках html


Начнём, пожалуй, с самого важного элимента в тексте - заголовка! Всего существует шесть размеров заголовков от <h1> (самый большой) и до <h6> (самый маленький)

<H1> текст </H1>

<H2> текст </H2>

<H3> текст </H3>

<H4> текст </H4>

<H5> текст </H5>
<H6> текст </H6>
Выделяя заголовки текстом, мы позволяем посетителям легко ориентироваться в тексте наших статей и вообще на всей странице сайта. Заголовками вы определяете структуру внутри текста.

Давайте теперь введем заголовок в наш документ. Мне кажется, что фраза "Здравствуйте, это моя первая страница" так и просится, чтобы ее выделили:        
<html>
<head>
  <title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
  <div align="center">

    <H3>Здравствуйте, это моя первая страница.</H3>

    <font color="#CC0000"> Добро пожаловать!</font> :) </div>
    <p align="justify">Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :)</p>
</body>
</html>
В пример я ввёл заголовок третьего уровня <h3></h3>. Как мы видим, визуально заголовки отображаются не только более крупным шрифтом, но к тому же и полужирным. Также после закрывающего </h3> происходит автоматически перенос на другую строку.

Заголовки предназначены для выделения небольшой части текста (строки, фразы). Но, если вы хотите выделить большой фрагмент текста, то заголовки для этого использовать нельзя. Для этого предназначен атрибут size тэга <font></font>, который устанавливает желаемый размер шрифта:
<font size="+4"> текст </font>

<font size="+3"> текст </font>

<font size="+2"> текст </font>

<font size="+1"> текст </font>

<font size="+0"> текст </font>

<font size="-1"> текст </font>
Как всегда, применяем новые знания на практике. Давайте, выделим, что мы горим желанием завести еще одного виртуального друга.     
<html>
<head>
  <title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
  <div align="center">

     <H3>Здравствуйте, это моя первая страница.</H3>

     <br>
     <font color="#CC0000"> Добро пожаловать!</font> :) </div>
     <p align="justify">Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится <font size="+1"> еще один виртуальный друг? :)</font></p>
</body>
</html>
Прежде, чем мы двинемся дальше, хочу предупредить, что есть такая опасная болезнь у начинающих сайтостроителей, как гигантомания. Ее симптомы: непомерно большие размеры шрифта, гигантские кнопища на пол экрана, вместо маленьких и милых кнопочек, и толстый (жирный) во всех случаях текст. Поэтому напоминаю: стандартный size (по умолчанию) ="+0".

Жалейте глаза своих посетителей, и они к вам потянутся.... а мы продолжаем...
« Пред.
 
След. »


Самое популярное


Последние новости


Разделы форума

→ Все разделы форума

Шаблоны Скрипты Книги Клипарт

Главная Новости Блоги Скачать Социальная сеть Форум

При перепечатке материалов ссылка на источник обязательна.

© Андрей Максимов, 2008-2011

Яндекс цитирования