Главная | Регистрация | Вход Приветствую Вас Гость | RSS
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Модератор форума: VIRTUS  
Форум » Самостоятельное создание сайтов » Создание несложного сайта и полезная информация по HTML » Урок 6: Ещё немного HTML-тэгов
Урок 6: Ещё немного HTML-тэгов
VIRTUSДата: Пятница, 25.12.2009, 18:47 | Сообщение # 1
Генералиссимус
Группа: Администраторы
Ранг пользователя:
Страна: Российская Федерация
Город: Санкт-Петербург
Сообщений: 201
Репутация: 101
Статус: Offline
Вы уже сделали несколько страниц ? Если нет, вот пример:

<html>

<head>
<title>My web-сайт</title>
</head>

<body>
<h1>A Heading</h1>
<p>text, text text, text</p>
<h2>Subhead</h2>
<p>text, text text, text</p>
</body>

</html>

Теперь что?

Теперь выучим семь новых тэгов.

Таким же образом, как вы делали текст жирным шрифтом с помощью тэга <b>, вы можете придать ему характер курсива/italic тэгом <i>. И конечно, "i" это сокращение от "italic".

Пример 1:

<i>Это должно быть выведено курсивом.</i>

будет выглядеть в браузере:
Это должно быть выведено курсивом.

Аналогично можно уменьшить размер шрифта тэгом <small>:

Пример 2:

<small>Это будет выведено уменьшенным шрифтом.</small>

будет выглядеть в браузере:

Это будет выведено уменьшенным шрифтом.

Могу ли использовать несколько тэгов одновременно?

Да, исключая перекрывание тэгов. Это проще увидеть на примере:

Пример 3:

Если вы хотите вывести текст bold и italic, это нужно сделать так:

<b><i>Текст bold и italic</i></b>

а НЕ так :

<b><i>Текст bold и italic</b></i>

Разница в том, что, в первом случае, мы закрыли первый тэг в последнюю очередь. Так мы избегаем конфликтов в браузере.
Ещё тэгов!

Как сказано в Уроке 4, есть тэги, которые являются одновременно открывающими и закрывающими. Эти тэги содержат команды, которые не связаны с конкретными буквами, являются изолированными командами. Пример - тэг <br />, который создаёт перевод строки:

Пример 4:

Некоторый текст<br /> и ещё текст, уже на новой строке

будет выглядеть в браузере:
Некоторый текст
и ещё текст, уже на новой строке

Заметьте, что этот тэг записан как гибрид открывающего и закрывающего тэгов с пробелом и слэшем: <br />. В принципе, его можно записывать <br></br>, но зачем усложнять?

Другой такой тэг - <hr /> - рисует горизонтальную линию ("hr" от "horizontal rule"):

Пример 5:

<hr />

будет выглядеть в браузере:
____________________________________________________________________________________________

Примеры тэгов, требующих наличия и закрывающего тэга: <ul>, <ol> и <li>. Эти тэги используются для вывода списков.

<ul> - сокращение от "unordered list/неупорядоченный список" - вставляет значок кнопки для каждого элемента списка. <ol> - сокращение от "ordered list/упорядоченный список" - нумерует каждый элемент списка. Для создания элемента списка используйте тэг <li> ("list item/элемент списка"). Непонятно? См. примеры:

Пример 7:

<ul>
<li>Элемент списка</li>
<li>Другой элемент списка</li>
</ul>

выглядит в браузере:
Элемент списка
Другой элемент списка

Пример 8:

<ol>
<li>Первый элемент списка</li>
<li>Второй элемент списка</li>
</ol>

выглядит в браузере:
Первый элемент списка
Второй элемент списка
Фи! И это всё?

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

<i>Italic</i>
<small>Уменьшенный шрифт</small>
<br /> перевод строки
<hr /> Горизонтальная линия
<ul>Список</ul>
<ol>Упорядоченный список</ol>
<li>Элемент списка</li>







 
Форум » Самостоятельное создание сайтов » Создание несложного сайта и полезная информация по HTML » Урок 6: Ещё немного HTML-тэгов
  • Страница 1 из 1
  • 1
Поиск:

Статистика Форума
Последнии темы Читаемые темы Лучшии пользователи Новые пользователи

Таблица стилей (CSS)

[2]

Скрипт Вида новостей от osite.ucoz.ru (2)

[0]

Набор персонала

[0]

Вопросы по модернизации

[5]

Скрытый текст как на dle. Скрипт для UcoZ.

[4]

Таблица стилей (CSS)

[2]

1. VIRTUS

[201]

2. Good

[5]

3. KeRO

[2]

saratoff

[25.01.2016]

BOPOH

[13.12.2015]

мой

[01.12.2015]

Rambler's Top100 Анализ сайта pr V1T.RU
Copyright MyCorp © 2009-2024
SORT