Официальный Форум технической поддержки сервиса ForumBB

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Официальный Форум технической поддержки сервиса ForumBB » Корзина » FAQ по дизайну форума в HTML


FAQ по дизайну форума в HTML

Сообщений 1 страница 6 из 6

1

Наряду с языком CSS (FAQ можно прочитать тут: FAQ по дизайну форума в CSS  ) при оформлении страниц Вы часто будете пользоваться и ещё одним языком - HTML. При веб-разработках одинакого важны оба эти языка и поэтому используются вместе. Сейчас мы попробуем разобраться в основах HTML, чтобы Вам легче было применить это на практике.
Итак, собственно весь этот язык - HTML - построен на тегах. Я думаю, Вы уже не раз сталкивались с ними. Выглядят они так:

<тег></тег>

С этими тегами мы и будем учиться работать. Вы должно быть уже обратили внимание, что тегов два, причём второй содержит в себе косую чёрточку. Это неспроста... Первый тег (на всякий случай, речь идёт об <тег>) называется тегом открывающим. По аналогии второй тег (</тег>) - закрывающий. Названы они так по очерёдности использования: первым идёт открывающий тег, и только потом - закрывающий!
ВАЖНО! Не все теги имеют закрывающие.
Важно так же учесть, что мы редко будем использовать теги одного типа по одиночке... Например для того, чтобы написать таблицу, нам придётся сначала указать тег таблицы, прописать столько тегов, сколько у нас строк, ну а далее в каждой строке указать по нужному количеству ячеек, за каждую из которых тоже отвечает тег... Запутались? Не торопитесь бросать это занятие... Всё проще, чем кажется...
Сейчас я покажу, как это выглядит на деле и ситуация прояснится...

<table><tr><td></td></tr></table>

А теперь смотрите:
Красные теги - это теги самой таблицы. В них даже и написанно - таблица, но не по-русски.
Зелёные теги - это теги строки. Они находятся внутри тегов таблицы. Так делается потому, что строка принадлежит таблице, является её частью.
Наконец оранжевые теги отвечают за ячейку, которая находится в строке таблицы, поэтому эти теги мы прописали в теге строки. Не сложно, правда, если разобраться по шагам.
Я не случайно выделил одинаковые теги одним цветом, так я хотел показать, в какой последовательности они расположены. Если идти по порядку, получится: таблица---строка---ячейка. Это были теги открывающие. Закрывать же придётся в обратной последовательности: ячейка---строка---таблица. Обращаю Ваше внимание, что действовать надо так и никак иначе. Если Вы перепутаете эту последовательность, то Ваше творение попросту откажется работать. Поэтому не торопитесь и будьте внимательны.
Ещё обратите внимание на то, чтоб не оказалось чего-то, наподобие </table или <tale> - это тоже приведёт только к тому, что код окажется нерабочим...
Ну и наконец последнее, что Вам надо знать - у тегов можно прописать параметры. Это тоже довольно просто. Рассмотрим на примере.
Допустим Вы в той же таблице, что писали выше, задумали сделать белый фон. Чтобы реализовать такое, берём два знакомых нам тега <table></table> и теперь:

<tableСЮДА ПРОПИСЫВАЕМ ПАРАМЕТР></table>
В случае с фоном таблицы, это будет выглядеть так:
<table bgcolor="#FFFFFF">...</table>. Обратите внимание, после параметра идёт равно и в кавычках прописывается значение параметра. У нас это - белый цвет - #FFFFFF. Если у Вас возник вопрос, где брать вот такой вод код для нужного цвета - наберите в любом поисковике "таблица веб-цветов". Их в сети навалом...
Ну и последний, думаю, самый важный для Вас вопрос: а где же брать эти теги? Ведь не придумывать же самостоятельно... Конечно же нет! В интернете существует множество справочников, где описан каждый из существующих тегов, но рыться в поисках нужного - это довольно утомительно. Тем более неподготовленному новичку. Поэтому тут я выпишу для Вас основные из них, что пригодятся при работе с форумом. Ну а Ваша задача - научиться пользоваться ими. Не беспокойтесь, если с первого раза не получится - всё приходит с опытом.
Итак, начали!

+1

2

Теги для работы с текстом.

<abbr>...</abbr>
Является тегом для вставки в текст аббревиатур. Например ТП - техническая поддержка.
Параметры:
title="..." - создаёт всплывающую подсказку при наведении мыши.
Пример использования:

Код:
<abbr title="Техническая поддержка ФОРУМББ">ФТП</abbr>

<acronym>...</acronym>
Является тегом для вставки в текст акронимов - аббревиатур, не требующих расшифровки. То есть, смысл которых ясен всем без пояснений.
Параметры:
title="..." - создаёт всплывающую подсказку при наведении мыши.
Пример использования:

Код:
<acronym title="Forum Bulletin Board">Forumbb</acronym>

<b>...</b>
Является тегом для жирного начертания текста.
Параметры:
Параметров не имеет.
Пример использования:

Код:
<b>Внимание всем!</b> Сегодня, с 15 до 17 часов будут проводиться плановые работы на сервисе.

<basefont>
Данный тег задаёт цвет, шрифт и размер текста для всего объекта (документа) по умолчанию. То есть прописав его в начале, мы установим заданные параметры абсолютно для всего документа, при этом можно выделять отдельные части текста другим цветом, шрифтом или размером. НЕ ТРЕБУЕТСЯ ЗАКРЫВАЮЩИЙ ТЕГ!!!
Параметры:
color="..." - устанавливает цвет текста.
face="..." - определяет гарнитуру шрифта.
size="..."  - задает размер шрифта в условных единицах.
Пример использования:

Код:
<basefont face="Arial" size="10" color="blue">Привет, пользователь поддержки сервиса ФОРУМББ!

<bdo>...</bdo>
Задаёт отображение текста: слева направо или справа налево.
Параметры:
dir="ltr" - отображение текста слева направо.
dir="rtl" - отображение текста справа налево.
Пример использования:

Код:
<bdo dir="rtl">А роза упала на лапу Азора</bdo>

0

3

Теги для работы с изображениями.

0

4

Теги для создания таблиц.

0

5

Теги для вставки видеороликов, музыки или флешанимации на форум.

0

6

Всё прочее.

0


Вы здесь » Официальный Форум технической поддержки сервиса ForumBB » Корзина » FAQ по дизайну форума в HTML