В тази глава:
Възможността за CSS свойства за стайлинг списъци
- Промяна на стандартния маркер за номерирани списъци
- Задаване на тип маркер за водещи списъци
- Задаване на изображение вместо маркер за списък на елементите
С два вида списъци могат да бъдат създадени с помощта на HTML-тагове с маркери: водещи символи и номерирани. По подразбиране повечето браузъри показват същата причина списъците под формата на кръг, и маркерите са номерирани под формата на цифри в последователност. CSS предоставя възможност за промяна на външния вид на стандартните маркери. Други примери ще бъдат показани с различни видове символи, с които можете да промените външния вид на техните списъци.
Редактиране и изтриване на маркери
За да промените CSS по подразбиране във външен вид маркер с помощта на имот списък стил тип. като стойността, дадена от вида на маркер, за който искате да замени стандарта.
Пример показва някои видове номерирани списъци маркери:
- Кликнете върху стойността на имота списък стил тип
- Наблюдавайте промяната на маркери
- Използване на най-подходящите маркери за техните списъци
ол # myList списък стил тип: десетични;
>
Кликнете върху някоя от стойността на имота, за да видите резултата
За списъците, има само три вида маркери, които могат да се задават с помощта на ценности кръг, диск и squred:
Със стойността на никой, можете да премахнете марки от елементите, включени в списъка, но лявото поле в същото време все още остават:
Резервни маркери снимки
Ако не се побира в нито една от неизпълнението на предложените маркери, СГО дава възможност да ги замени с всяка снимка, това ще ви помогне списък стил изображение собственост. по смисъла на който е необходимо да се определят пътя на избраното изображение.
Вземете под внимание факта, че изображението е оразмерена автоматично, както и списък ще се появи собствен размер, така че ще трябва да изберете подходящ размер на изображението или да редактирате съществуващ, да намали или да го увеличи до правото:
тире списък
Когато премахнете маркерите от списъка с елементи, също може да премахне или намали размера на лявото поле, е браузър по подразбиране. За да премахнете напълно вдлъбнатината ще трябва да използвате имот вата-ляво. който ви позволява да настроите вътрешния подложка:
В примера сме напълно премахнати вдлъбнатината от лявата страна, така че елементите на списъка вече са плоски в ръба на прозореца на браузъра. И както може да се види от примера на списък с водещи символи се показва точно както е било планирано, но маркерите бяха изчезнали в номериран списък. Причината се крие в самите символи - по подразбиране маркери не са част от съдържанието на елементите на списъка, така че ако се отстрани лявото поле те не се движат заедно с съдържанието на елементите
Имоти списък стил позиция определя дали маркера се намира във или извън елементите на списъка. Този имот може да има две стойности:
- отвън - маркер отляво на съдържанието (стойност по подразбиране)
- вътре - маркера се намира в рамките на елемента от списък със съдържанието
Сега можем да пренапишем предишния пример, така че вдлъбнатината от лявата страна е отстранен, но маркерите без да излизате от рамката на браузъра:
В примера на рамката се добавят към всяко елемент от списъка, за да се покаже визуално границите на елементите на списъка.
Свързани статии