Урок 6: Ещё немного HTML-тэгов


Вы уже сделали несколько страниц ? Если нет, вот пример:

      <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>
выглядит в браузере:
  1. Первый элемент списка
  2. Второй элемент списка

Фи! И это всё?

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

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

Комментариев нет:

Отправить комментарий

Подписаться на: Сообщения (Atom)