logo

Стилове на CSS списък

Списъкът в CSS определя как съдържанието или елементите са изброени по определен начин, т.е. те могат да бъдат подредени спретнато или произволно, което помага при създаването на чиста уеб страница. Тъй като са адаптивни и лесни за работа, те могат да се използват за организиране на големи количества материали. Стилът по подразбиране на списъка е без граници. Списъкът може да бъде разделен на две категории:

    Неподреден списък:По подразбиране елементите на списъка в неподредените списъци са обозначени с водещи символи, които са малки черни кръгове.Подреден списък:Елементите на списъка в подредените списъци се идентифицират с цифри и букви.

Следните свойства на CSS списък са налични за използване при контролиране на CSS списъците:

    List-style-type:Това свойство се използва за определяне на външния вид на маркера на елемент от списъка, като диск, символ или потребителски стил на брояч.Списък-стил-изображение:Картините, които ще служат като маркери на елементи от списъка, могат да бъдат зададени с помощта на този параметър.List-style-position:Той описва къде трябва да бъде маркерната кутия около основната блокова кутия.Стил на списък:С този атрибут се конфигурира стилът на списъка.

Сега ще научим повече за тези характеристики чрез примери.

Свойство тип стил на списък

Списъчният тип маркер по подразбиране може да бъде променен на различни други типове, включително квадрат, кръг, римски цифри, латински букви и много други. Записите в неподреден списък са обозначени с кръгли символи (•), докато елементите в подреден списък са номерирани по подразбиране с арабски цифри (1, 2, 3 и т.н.).

Маркировките или куршумите ще бъдат премахнати, ако зададем стойността им на нищо.

Синтаксис:

list-style-type:value;

как да върна масив java

Можем да използваме стойността, както следва:

  1. кръг
  2. десетичен знак, напр.:1,2,3 и т.н
  3. десетични водещи нули, напр.:01,02,03,04 и т.н.
  4. долно-римски
  5. горно-римски
  6. по-ниска алфа, например a,b,c и т.н
  7. горна алфа, напр. A, B, C и т.н
  8. квадрат

Забележка: В списъка са включени и подложките и полето по подразбиране. Необходимо е да добавите padding:0 и margin:0 към
    и
      етикети, за да елиминирате това.

Пример

Този пример показва CSS списък с няколко типа списъчни стилове и стойности, зададени на квадрат, горна буква и много.

 Example for CSS Lists .num{ list-style-type:decimal; } .alpha{ list-style-type:upper-alpha; } .circle{ list-style-type:circle; } .square{ list-style-type:square; } .disc{ list-style-type:disc; } <h2> Ordered Lists </h2> <ol class="order"> <li>ONE</li> <li>TWO</li> </ol> <h2> Unordered lists </h2> <ul> <li>ONE</li> <li>TWO</li> </ul> 

Изход

Стилове на CSS списък