Сделайте из себя - вебмастера!
Главная страница
Вся информация об этом сайте расположена здесь
Здесь можно скачать различную музыку
Лучшие 50 песен за последний месяц
Что-то ищете? Вам сюда!
Охота пообщаться и провести дискуссии? Вам сюда!
Общайтесь в реальном времени с реальными людьми!
Остроты, шутки, приколы, картинки, полезная инфа и многое другое
Для тех, кто хочет создать свой сайт
Для тех, кто имеет свой сайт и знает HTML
Форум сайта. Заходите, регистрируйтесь, общайтесь!


Форматирование текста - основная часть в работе по созданию web-страниц, да и сайтов в общем. Ведь просто текст у вас на сайте напечатан не будет, а сделать некоторые слова выделеными цветом, полужирным, курсивом, подчёркнутым, бегущей строкой, да и гиперссылкой охота! Вся эта (и не только) информация выложена в этом разделе, так что читайте и вникайте! Почти все теги, используемые в этом разделе, парные.

 

Собственно, это и не тег то вообще, у него даже скобок открывающих и закрывающих нет. Даёт эффект пробела, т.е. равносилен ему. Используется, когда нужно ввести более одного пробела, ведь браузер не поддерживает пробел, введённый на клавиатуре, когда он применяется более одного раза. Попробуйте разделить два каких-нибудь слова пробелами, когда будете создавать сайт. Если вы введёте два и более пробела, то обозреватель их просто проигнорирует. А вот если вы введёте после одного пробела введёте этот значок, и при этом не обязательно, что вы введёте один такой символ, может, вам нужен широоооокий такой пробел, то результат увидите при просмотре страницы через браузер. Более подробную информацию об остальных спецсимволах вы найдёте в разделе EXE.

<b>

Текст, заключённый между этими тегами, отображается полужирным. Тот же эффект даёт тег <strong>.

<i>

Текст, заключённый между этими тегами, отображается курсивом. Тот же эффект дают теги <em> и <cite>.

<u>

Текст, заключённый между этими тегами, отображается подчёркнутым. Тот же эффект даёт тег <ins>.

<s>

Текст, заключённый между этими тегами, отображается перечёркнутым. Тот же эффект дают теги <strike> и <del>.

<tt>

Текст, заключённый между этими тегами, отображается как моноширный (стиль Courier New). Тот же эффект дают теги <code>, <kbd> и <samp>.

<sup>

Текст, заключённый между этими тегами, отображается как надстрочный.

<sub>

Текст, заключённый между этими тегами, отображается как подстрочный.

<big>

Текст, заключённый между этими тегами, отображается на размер больше заданного.

<small>

Текст, заключённый между этими тегами, отображается на размер меньше заданного.

<blockquote>

Текст, заключённый между этими тегами, отображается как цитата, увеличивая размеры полей отступа.

<center>

Текст, заключённый между этими тегами, размещается посередине документа и в отдельную строку.

<br>

Текст, после которого стоит этот тег, переносится на новую строку. При этом тег непарный.

<nobr>

Текст, заключённый между этими тегами, даёт браузеру команду никогда не переносить текст на другую строку, какой бы длины он не был.

<pre>

Иногда ради того, чтобы сделать кучу пробелов, вам придётся поставить много символов &nbsp;. Однако, браузер можно заставить воспринимать более одного клавиатурного пробела, плюс ещё и начнёт воспринимать клавишу enter и прочие табуляторы, достаточно заключить текст между тегами <pre>. Единственый недостаток этого элемента - так это то, что текст, заключённый между этими тегами, отображается, как моноширный.

<hr>

Отдаёт браузеру команду отчертить горизонтальную линию.

Параметры:

width - задаёт ширину линии в пикселах, либо в процентном соотношении по отношению к той области, где будет отчерчена линия. По умолчанию имеет значение 95%, либо 100%, смотря у кого какой браузер.

align - задаёт расположение линии. Возможные значения: center (по умолчанию), left и right.

<h1>...<h6>

Текст, заключённый между этими тегами, отображается, как заголовок различных размеров - всё зависит от того, какая цифра, 1, 2, 3, 4, 5 или 6, установлена после h. Чем ближе цифра к единице, тем больше будет заголовок. Например, слово "Параметры", которое вы видите ниже, имеет размер h4.

Параметры:

align - задаёт расположение заголовка. Возможные значения: left (по умолчанию), center и right.

<font>

Основной элемент при форматироании текста. Задаёт цвет, размер и шрифт текста, заключённого между этими тегами.

Параметры:

color - задаёт цвет текста. Значением может быть название любого стандартного (базового) цвета, либо его RGB-значение (что это такое, вы можете узнать в разделе "EXE").

size - задаёт размер текста (от 1 до 7).

fase - задаёт шрифт, на котором напечатан текст. Значением может быть название любого стиля написания текста. Стили текстов вы можете узнать, запустив программу Microsoft Word, и посмотрев в соответствующем списке в верхних строчках.

<basefont>

Элемент задаёт изначальный размер и стиль текста, напечатанного в документе, однако на содержимое таблиц это не распространяется. Тег непарный.

Параметры:

size - задаёт изначальный размер текста (от 1 до 7).

fase - задаёт изначальный шрифт, на котором напечатан текст. Значением может быть название любого стиля написания текста.

<p>

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

Параметры:

align - задаёт расположение текстового блока. Возможные значения: left (по умолчанию), center, right и justify (это по ширине, кто ещё не понял).

<marquee>

Создаёт бегущую строку.

Параметры:

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

bgcolor - задаёт фон, по которому будет двигаться объект, заключённый между тегами.

behavior - задаёт вид движения объекта, заключённого между тегами. Если установлено значение alternate, то двигаться объект будет в стиле "туда-сюда" (в смысле, из левого конца - в правый, и обратно). А если значение не установлено, или данный параметр отсутствует вообще, то тогда двигаться объект будет, как текст вверху каждой страницы моего сайта.

scrolldelay - задаёт заторможенность движения объекта, заключённого между тегами, в миллисекундах. Значением может быть число от 60 до n.

scrollamount - задаёт скорость движения объекта, заключённого между тегами. Значением может быть число от 1 до n (чем больше число - тем быстрее).

<div>

Этот тег может практически всё. Отличие от тега <span> лишь в том, что он отделяет заключённый в него текст в отдельную строку.

Параметры:

Принимает большинство параметров, которые только возможны при форматировании текста плюс даёт возможность применять к объекту, заключённому между этими тегами, стили CSS и добавлять сценарий JavaScript.

<span>

Этот тег может практически всё. Отличие от тега <div> лишь в том, что он оставляет заключённый в него текст в одной строке с остальным текстом.

Параметры:

Принимает большинство параметров, которые только возможны при форматировании текста плюс даёт возможность применять к объекту, заключённому между этими тегами, стили CSS и добавлять сценарий JavaScript.

<a>

Создаёт гиперссылки. Без этого элемента интернет просто не был бы интернетом, а запоминать адрес каждой страницы нереально. Проще щёлкнуть мышкой на объекте, и перейти куда надо. И тут на помощь приходят гиперссылки...

Параметры:

href - задаёт находящийся между начальным и конечным тэгами текст или изображение как гипертекстовую ссылку (URL, или линк) на документ (и/или область документа), указанный в значении данного параметра. Возможные значения:

    http://... - создает ссылку на www-документ. Допустим, я хочу сделать ссылку на сайт радиостанции "Европа плюс". Её адрес - europaplus.ru . Я набираю следующее: <a href="http://www.europaplus.ru/" target="_blank">Сайт Европы плюс</a> (о параметре target узнаете ниже). В итоге создастся следующая ссылка: Сайт Европы плюс. Попробуйте на неё нажать, и посмотрите, что получится;
    ftp://... - создает ссылку на ftp-сайт или расположенный на нем файл. Действия те же, только вместо http:// вводится ftp://, и вместо www - ftp соответственно;
    mailto:... - запускает почтовую программу-клиент с заполненным полем имени получателя. Если после адреса поставить знак вопроса, то можно указать дополнительные атрибуты, разделенные знаком "&". Например, если установить атрибут subject=тема_сообщения, то в поле "Тема" отобразится написаное, если установить cc=адрес_получателя/лей_копии_сообщения, то в поле "Копия" отобразится адрес получателя (или получателей) копии этого сообщения, а если установить body=текст_сообщения, то в поле ввода сообщения уже будет текст. Допустим, в HTML-коде я ввёл <a href="mailto:zed-92@narod.ru?subject=Пример&cc=eht40@narod.ru&body=Введите сюда своё сообщение">Ссылка</a>. Вот эта Ссылка. Нажмите на неё и посмотрите, что получится;
    news:... - создает ссылку на конференцию сервера новостей.;
    telnet://... - создает ссылку на telnet-сессию с удаленной машиной;
    wais://... - создает ссылку на WAIS - сервер;
    gopher://... - создает ссылку на Gopher - сервер;

name - помечает находящуюся между начальным и конечным тегами область документа как возможный объект для ссылки. В качестве значения нужно латиницей написать любое слово-указатель, уникальное для данного документа. Необходим для создания закладок. Чтобы её создать, необходимо сделать следующее: предположим, каком-нибудь рассказе я захотел сделать ссылку с пятидесятой главы на главу тридцать вторую. Ну не будет же посетитель искать эту чёртову главу, которая находится где-то в середине предышущей страницы, особенно, если она ему толком то и не нужна! Хуже, он может разозлиться на такое хреновое обслуживание клиентуры на вашем сайте, развернутся, и нажать в строке адреса на какой-нибудь другой сайт. Вам оно нужно?! Если ваш ответ "нет", то читайте и вникаете: Я заключаю какой-нибудь объект, к примеру, текст "Глава 32", в следующую раскладку изучаемого нами тега - <a name="имя_объекта">Глава 32</a> (имя должно быти напечатоно исключительно на английском). На вид текста "Глава 32" это ну никак не повлияет! Теперь создадим относительную ссылку на этот текст: а почему у него были такие тупые мысли, вы сможете узнать в <a href=http://zed-92.narod.ru/rasskaz.htm#имя_объекта>главе 32й</a>. Причём имя объекта всегда пишется после знака решёточки ("#"). И следите за тем, чтобы на одной странице имена не повторялись!

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

    _self - указывает, что определенный в параметре href документ должен отображаться в текущем фрейме;
    _parent - указывает, что документ должен отображаться во фрейме-родителе текущего фрейма. Иначе говоря, _parent ссылается на окно, содержащее FRAMESET, включающий текущий фрейм;
    _top - указывает, что документ должен отображаться в окне-родителе всей текущей фреймовой структуры;
    _blank - указывает, что документ должен отображаться в новом окне. Именно это значение необходимо установить при создании ссылок на другие узлы.

<ul>

Создаёт маркированый список.

Параметры:

type - задаёт тип маркера. Если указано значение circle, то маркер будет выглядеть как круг с незаполненой внутренней частью. При установке значения square маркер будет выглядеть как квадрат. Ну а по умолчанию задан тип disk, который рисует маркер в виде круга.

<ol>

Создаёт нумерованый список.

Параметры:

type - задаёт тип маркера. При указании значения i номер пункта будет выглядеть как маленькие римские цифры. Если установлено значение I, то номер пункта будет выглядеть как большие римские цифры. Также можно сделать буквенные значения. Для этого необходимо, чтобы значением была указана латинская буква a, чтобы обозначением были маленькие буквы, и A, чтобы обозначением были большие буквы. По умолчанию задан тип 1, который делает обозначение пункта - цифрами.
start - задаёт номер того пункта, с которого нужно начать отсчёт пунктов. В качестве значения может быть указано любое числовое, либо номер той буквы, с которой следует вести отсчёт (1-n).

<li>

Создаёт пункты списков. Тег непарный. Интересность его в том, что в чем большее кол-во тегов <ol> и <ul> он будет заключён, тем дальше список будет отодвинут от исходной строки. Также можно создавать многоуровневые списки (т.е. список в списке, список как подпункт другого списка, иерархия списков). Использовать можно как внутри тегов <ol> и <ul>, так и самостоятельно, только тогда список будет исключительно маркированым.

Параметры:

type - задаёт тип маркера. Если указано значение circle, то маркер будет выглядеть как круг с незаполненой внутренней частью. При установке значения square маркер будет выглядеть как квадрат. А если вам нужно сделать маркер в виде круга, то укажите значение disk.
value - задаёт номер того пункта, с которого нужно начать отсчёт пунктов с этого момента. В качестве значения может быть указано любое числовое обозначение, либо номер той буквы, с которой следует вести отсчёт (1-n). Используется исключительно тогда, когда список является нумерованым.


Пример 1:

Исходный текст:

<b>Полужирный текст</b><br>
<i>Курсив</i><br>
<u>Подчёркнутый текст</u><br>
Наверное, очень <u><i><b>важное</b></i></u> слово<br>
<s>Перечёркнутый текст</s><br>
<tt>Моноширный текст</tt><br>
Запишем формулу серной кислоты:
 H<sub>2</sub>SO<sub>4</sub><sup>конц.</sup><br>
Это слово <big>больше</big>, а это 
<small>меньше</small> 
остальных. <br>
Как сказал тов. Сталин:<br>
<blockquote>Есть человек - есть проблема, <br>
Нет человека - нет проблемы.</blockquote>
Этот текст нужно<br> перенести
<center>Этот текст расположен по центру</center>
<nobr>Этот текст не переносится</nobr>
<hr width="80%"><h1>Заголовок №1</h1>
<h2>Заголовок №2</h2>
<h3>Заголовок №3</h3>
<h4>Заголовок №4</h4>
<h5>Заголовок №5</h5>
<h6>Заголовок №6</h6>
<font size=1>Шрифт 1го размера</font><br>
<font size=2>Шрифт 2го размера</font><br>
<font size=3>Шрифт 3го размера</font><br>
<font size=4>Шрифт 4го размера</font><br>
<font size=5>Шрифт 5го размера</font><br>
<font size=6>Шрифт 6го размера</font><br>
<font size=7>Шрифт 7го размера</font><br>
<font color=green>Зелёный текст</font><br>
<font color=#008000>Так же зелёный текст</font>
<p>Текст взят в отдельный абзац.</p>
<marquee scrollamount=4 bgcolor=#ff8000>
Бегущая строка на 4той скорости</marquee>
<a href="http://www.yandex.ru" target=_blank>
Эта ссылка ведёт на Яндекс, открывая его 
в новом окне</a><br>
Маркированый список: 
<ul>
<li>1 пункт
<li type="square">2 пункт
</ul>
Нумерованый список: 
<ol type=a start=2>
<li>Начнём со 2 пункта
<li>3 пункт
<li value=6>Продолжаем с 6 пункта
<li>7 пункт
</ol>
Обычный список:
<li>1 пункт
<li>2 пункт
<li>3 пункт

Результат:

Полужирный текст
Курсив
Подчёркнутый текст
Наверное, очень важное слово
Перечёркнутый текст
Моноширный текст
Запишем формулу серной кислоты: H2SO4 конц.
Это слово больше, а это меньше остальных.
Как сказал тов. Сталин:
Есть человек - есть проблема,
Нет человека - нет проблемы.
Этот текст нужно
перенести
Этот текст расположен по центру
Этот текст не переносится

Заголовок №1

Заголовок №2

Заголовок №3

Заголовок №4

Заголовок №5
Заголовок №6
Шрифт 1го размера
Шрифт 2го размера
Шрифт 3го размера
Шрифт 4го размера
Шрифт 5го размера
Шрифт 6го размера
Шрифт 7го размера
Зелёный текст
Так же зелёный текст

Текст взят в отдельный абзац.

Бегущая строка на 4той скорости Эта ссылка ведёт на Яндекс, открывая его в новом окне
Маркированый список:
  • 1 пункт
  • 2 пункт
Нумерованый список:
  1. Начнём со 2 пункта
  2. 3 пункт
  3. Продолжаем с 6 пункта
  4. 7 пункт
Обычный список:
  • 1 пункт
  • 2 пункт
  • 3 пункт

  • <<<Предыдущий раздел|Следующий раздел>>>

                                                                              С ЧЕГО НАЧАТЬ
    ФОРМАТИРОВАНИЕ ТЕКСТА
    РИСУНКИ И ВСТАВКИ
    ТАБЛИЦЫ
    ФОРМЫ
    СТРУКТУРА
    CSS
    РАЗМЕЩЕНИЕ
    В ЗАКЛЮЧЕНИЕ
    EXE

    Используются технологии uCoz