Варна - 2006

Съдържание:

HTML - Въведение
HEAD
BODY - фон, текст, цветове на връзките
FONT - работа с текстове
Форматиране на параграфи
Цветове
Хипервръзки
IMG - Изображения
Таблици
Списъци
Формуляри
Линии
Фреймове
Музикален фон

Списъци

Неномерирани списъци:

Таговете за неномерирани списъци (списъци с точки) са ul и li

<ul>
<li>Първи елемент от списъка </li>
<li>Втори елемент от списъка </li>
<li>Трети елемент от списъка </li>
</ul>

Ефекта от този код в браузъра е следния:

  • Първи елемент от списъка
  • Втори елемент от списъка
  • Трети елемент от списъка
  • Знакът, който се появява пред всеки ред в списъка, е по подразбиране черен запълнен кръг.
  • Ако желаете да използвате други символи трябва да ги зададете като стойности към атрибута type на тага ul.
  • Възможните стойности са три: disc (запълнен кръг като този, който е по подразбиране), circle (незапълнен кръг), square (запълнен квадрат).
  • Например:<ul type="circle">

Номерирани списъци:

  • Подредените списъци извършват подредбата на елементите по един от следните начини:
    • чрез арабски цифри - 1 2 3
    • чрез големи римски цифри - I II III
    • чрез малки римски цифри - i ii iii
    • чрез главни латински букви - A B C
    • чрез малки латински букви - a b c

Примери:
<ol type="I" >
<li>
Първи елемент от списъка, номериран с големи римски цифри </li>
<li>
Втори елемент от списъка, номериран с големи римски цифри </li>
<li>Трети елемент от списъка, номериран с големи римски цифри </li>
</ol>

<ol type="a" >
<li>
Първи елемент от списъка, обозначен с малки букви </li>
<li>Втори елемент от списъка, обозначен с малки букви </li>
<li>Трети елемент от списъка, обозначен с малки букви </li>
</ol>
Ако не е посочен атрибута type , номерацията е с арабски цифри 1., 2., 3. и т.н.

Упражнение 15:

а) Копирайте следния текст в лявата част на прозореца по-долу и натиснете бутона над него.

<html>
<body>

<h4>Списък с точки :</h4>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>

</body>
</html>

б) Добавете атрибут type, за да промените вида на точките.

в) Номериран списък:

<html>
<body>

<h4>Списък на класа :</h4>
<ol>
<li>Александър</li>
<li>Боряна</li>
<li>Валери</li>
</ol>

</body>
</html>

д) Следващият пример е за използване на вложени списъци:

<html>
<body>

<h4>Вложени списъци </h4>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>

</body>
</html>

Упражнение 16:

Списъци в Dreamweaver

  1. Въведете текст като след всеки ред натискайте клавиша за край на параграф (Enter), маркирайте го и посочете от Properties бутона с номерация 1,2 или бутона с трите точки една под друга.
  2. Вложени списъци се получават като за всяко следващо ниво посочвате бутончетата за отместване навътре или навън.
  3. Типа на точките и номерацията се определя от менюто Text/List/Properties като се избира подходящия стил на номерацията или знака за неномерирания списък.
JDJ © 2006 Всички права запазени.