ХТМЛ листа. Примена ЦСС стилова
На многим ХТМЛ страницама у тексту можете видјети листе. Уз њихову помоћ, креирајте меније, инструкције, корак по корак алгоритме, систематизујте информације и изведите много више. ХТМЛ листа се креира помоћу језика за означавање текста. Да бисте то урадили, користите неколико ознака. Ово је један од најчешћих облика представљања информација у компримираном облику и истовремено јасно.
Листе се углавном користе у следећим случајевима:
- приказивање информација у једној структури са погодном перцепцијом;
- поједностављивање сложених секвенцијалних процеса;
- стварање структура са садржајем, тачкама и објашњењима.
Листе постоје у три варијанте:
- нумерисан;
- означена;
- листе дефиниција.
Нумерисана листа
Нумерисање је згодно када се ставке редом наводе. ХТМЛ листа се отвара и затвара ознакама <ол> и </ ол>.
Код листе ће бити:
<ол>
<ли> 1 ставка </ ли>
<ли> 2 </ итем> елемент
<ли> 3 елемент </ ли >›
</ ол>
Свака позиција се налази унутар ознаке <ли>.
Буллетед лист
Позиције нису нумерисане и распоређене у произвољној секвенци. Листа кодова је слична претходној. Једина разлика је што се налази унутар ознаке <ул>:
<ул>
<ли> прво </ ли>
<ли> друго </ ли>
<ли> треће </ ли>
- </ ул>
Подразумевани маркер је означен црним кругом, али се његова слика мења коришћењем атрибута типа, на пример:
<ул типе = "скуаре">
Слично томе, промените ознаку нумерисане листе, на пример, додељивањем атрибута литералној вредности:
<ол типе = "А">
Листа дефиниција
Често је потребно одабрати ријечи из главног текста и дати им објашњења. Да бисте то урадили, направите листу елемената са њиховим дефиницијама. Код се отвара и затвара ознакама <дл> и </ дл>. Унутарњи елементи су поредани по елементима који су затворени у пар <дт> и </ дт>. Често се додатно разликују по ознакама <стронг> ... </ стронг>. Након сваке ставке су објашњења, уоквирена упареним <дд> ... </ дд>. Генерално, код изгледа овако:
<х2> ДефинитионЛист </ х2>
<дл>
<дт> ввв </ дт>
<дд> ввв представља Ворлд Виде Веб </ дд>
<дт> ЦСС </ дт>
<дд> ЦСС представља стилске листове </ дд>
</ дл>
На страници ће резултат извршавања овог кода изгледати овако: 
Падајућа листа
Понекад је згодно да се листе спуштају. У почетном стању, они су затворени, а по дефаулту је видљива само прва позиција. Шема кода је слична претходној. Ставке листе се креирају помоћу ознаке опције која је уграђена у <селецт> контејнер:
<селецт>
<оптион> ел1
<оптион> ел2
<оптион селецтед> ел3
Подразумевано је да се прва ставка увек приказује. Може се заменити применом изабраног атрибута ознаке <оптион>, као што је приказано у коду у падајућој листи. Трећа ставка постаје видљива у њој када је листа затворена.
У неким листама је потребно изабрати неколико позиција одједном. За ово се користи вишеструки атрибут ознаке <селецт>.
Како направити листу у ХТМЛ-у и ЦСС-у
Иако је марка широко распрострањена, она је прилично ограничена. ХТМЛ падајућу листу побољшава ЦСС. Његов тип може бити било који.
<див цласс = "роллс">
<буттон> производи
<ул>
<а> <ли> 1 елемент </ ли> </ а>
<а> <ли> 2 елемент </ ли> </ а>
<а> <ли> 3 елемент </ ли> </ а>
</ ул>
Сада морате да примените ЦСС својства на код. Често се користе за спектакуларан дизајн, али је боље да се прво фокусирате на осигурање ефикасности падајуће листе. Требало би да се појави на екрану када пређете преко наслова.
Стилови постављају услове за приказивање или скривање листе:
.роллс а {
лист-стиле: нема;
дисплаи: ноне}
.роллс: ховер а {
дисплаи: блоцк}
Тако, када миш лебди изнад дугмета, листа приказана на слици испод појављује се на страници. 
Падајуће листе на више нивоа
Када распоред странице једноставне листе можда неће бити довољно, али количина информација би требало да буде сјајно. Ту спадају спустне листе на више нивоа. Њихова структура је понекад комплексна. Да бисте елиминисали грешке, пажљиво пратите почетне и завршне ознаке. Претходна листа дефиниција је такође вишеразинска. Погодно је користити за стварање рјечника или објашњења појмова.
Падајућа листа ХТМЛ-а се користи да не би закрчила страницу и проширила њене могућности. Као основно средство, довољно је користити маркуп језик. У исто време, за било који ниво гнезда, код остаје исти.
Функционално, ХТМЛ листа ће радити, али уз употребу стилских листова можете је дизајнирати тако да буде лепа и удобна. 
Закључак
Постоје листе различитих типова ХТМЛ-а. Креирају се по истој шеми, укључујући и угњеждене. Карактеристике листа су побољшане ЦСС стиловима. Помоћу стилова можете креирати јединствене алате. Истовремено, важно је да листе буду правилно семантички осмишљене како би се олакшало одржавање самих локација.