СПИСЪЦИ
Езика HTML ви дава възможност да използвате три вида списъци - подредени, неподредени и списъци с обяснения. Подредените списъци са номерирани. Неподредените списъци използват вместо номерация, някакъв символ (например точка). Списъците с обяснения не използват символ или цифра пред текста. Вместо това поставят обяснителен текст след всеки елемент от списъка.
Подреден списък можете да създадете с елемента <OL> и съответно затварящия </OL>. Елементите на списъка се задават с елемента <LI>, който може да се използва като двойка елементи или като единичен елемент. Нека направим един такъв списък:
<HEAD>
<TITLE> ordered list</TITLE>
</HEAD>
<BODY>
да не забравя да купя:
<OL>
<LI>захар
<LI>яйца
<LI>сода каустик за тъщата
</OL>
</BODY>
Въпреки, че не сме задали да се показват номера 1. 2. 3., те се добавят автоматично в списъка. Ако изкате списъка да се показва с римски вместо с арабски цифри, трябва да добавите атрибут TYPE на елемента <OL>. Атрибута TYPE показва какви символи да се визуализират преди елементите на списъка. Стойностите на атрибута TYPE за подредените списъци са:
TYPE=1 - за списъци, номерирани с арабски цифри
TYPE=a - за списъци, номерирани с малки латински букви
TYPE=A - за списъци, номерирани с големи латински букви
TYPE=i - за списъци, номерирани с малко римски цифри
TYPE=I
- за списъци, номерирани с големи римски цифри
Така че ако искате вместо
1. захар
2. яйца
3. сода каустик за тъщата
на екрана да се вижда
I. захар
II. яйца
III. сода каустик за тъщата
трябва да добавите към елемента <OL> TYPE=I . С други думи трябва да напишете <OL TYPE=I>. Ако пропуснете атрибута TYPE, по подразбиране ще се показва списък от типа 1. 2. 3.
Неподреден списък се създава с двойката елементи <UL></UL>. Този списък за разлика от подредения не е номериран, а използва някакъв символ за всеки елемент от списъка, например точка.
Да направим горния пример да се показва като неподреден списък:
<HEAD>
<TITLE> unordered list</TITLE>
</HEAD>
<BODY>
да не забравя да купя:
<UL>
<LI>захар
<LI>яйца
<LI>сода каустик за тъщата
</UL>
</BODY>
При неподредените списъци също можете да използвате атрибута TYPE. Валидните стойности за него са disk(диск), square(квадрат) и circle(кръг).
Списъците с обяснения се създават с двойката елементи <DL></DL>. Елементите на списъка се задават с <DT>, а обяснението към него с <DD>:
<HEAD>
<TITLE>definition list</TITLE>
<HEAD>
<BODY>
<DL>
<DT>Иван
<DD>счетоводител
<DT>Георги
<DD>касиер
<DT>Захари
<DD>данъчен инспектор
</DL>
</BODY>
Ако желаете, можете да влагате един в друг списъци от един вид или от различни видове. например:
<HEAD>
<TITLE>вложени списъци</TITLE>
</HEAD>
<BODY>
<OL>
<LI>Да купя за вкъщи:
<UL TYPE=circle>
<LI>сладолед
<LI>торта
</UL>
<LI>Да купя за офиса:
<UL TYPE=circle>
<LI>дискети
<LI>химикалки
<LI>нова мишка
</UL>
</OL>
</BODY>
Можете да използвате и собствени картинки при неподредените списъци. Например:
<HEAD>
<TITLE>списък с картинка</TITLE>
</HEAD>
<BODY>
<UL imagesrc="point.gif">
<LI>дискети</LI>
<LI>химикалки</LI>
<LI>нова мишка</LI>
</UL>
</BODY>
Използвайки атрибута imagesrc на елемента <UL> зададох на списъка името на файла, който да се показва пред елементите. Картинката е файл с име point.gif и трябва да се намира в основната папка, където разполагате HTML документите си. Можете да я сложите и в под папка, но тогава трябва да зададете и пътя до нея, например: <UL imagesrc="images/point.gif"> ако подпапката се казва images.
ХОРИЗОНТАЛНИ ЛИНИИ
Езика HTML позволява да се изчертават хоризонтални линии с елемента <HR>. Този елемент няма съответен затварящ елемент, но има някои атрибути. Дължината на линията се задава с атрибута WIDTH на елемента <HR>. Дължината можете да зададете в пиксели или в проценти от вирината на екрана. Нека начертаем 2 линии, едната е дължина 100 пиксела, а другата 100% от ширината на екрана:
<HEAD>
<TITLE>Хоризонтални линии</TITLE>
<HEAD>
<BODY>
<HR WIDTH=100>
<HR WIDTH=100%>
</BODY>
Когато променяте размера на прозореца на браузъра втората линия ще се променя с него, докато първата ще си остане 100 пиксела. Обърнете внимание, че линиите се подравняват в средата по подразбиране. Ако искате да промените това
положение трябва да използвате атрибута ALIGN, и неговите параметри left, center и right, съответно за подравняване вляво, в средата и вдясно на страницата. Параметъра center спокойно можете да го пропуснете, защото линията така или иначе се подравнява в средата при липсата на атрибута ALIGN. Сега да начертаем две линии с дължина по 300 пиксела и да ги подравним съответно вляво и вдясно:
<HEAD>
<TITLE>Хоризонтални линии</TITLE>
<HEAD>
<BODY>
<HR WIDTH=300 ALIGN="left">
<HR WIDTH=300 ALIGN="right">
</BODY>
Дебелината на линията се променя с атрибута SIZE. Параметрите на SIZE се задават в пиксели. Например SIZE=5 означава, че линията е с дебелина 5 пиксела. Ето какво представлява такава линия с дължина 80%, подравнена в средата:
<HEAD>
<TITLE>Хоризонтални линии</TITLE>
<HEAD>
<BODY>
<HR WIDTH=80% SIZE=5>
</BODY>
Ако зададем и атрибута NOSHADE линията ще се покаже плътна, без сянка.
<HEAD>
<TITLE>Хоризонтални линии</TITLE>
<HEAD>
<BODY>
<HR WIDTH=80% SIZE=5 NOSHADE>
</BODY>
Цвят на линията можете да зададете с COLOR, но се опасявам, че почитателите на Netscape няма да го видят. Ето една синя линия с дебелина 8 пиксела и ширина 90%:
<HEAD>
<TITLE>Хоризонтални линии</TITLE>
<HEAD>
<BODY>
<HR WIDTH=90% SIZE=8 COLOR="#0000FF">
</BODY>