list-style-type сипаттамасы

list-style-type сипаттамасы ul тізімі үшін нүктелердің орнына шаршылар немесе шеңберлер жасауға мүмкіндік береді. ol тізімі үшін қарапайым сандардың орнына рим сандарын, әріптер түріндегі нөмірлеуді жасауға болады: латын немесе грек әріптері.

Синтаксис

селектор {
	list-style-type: мән;
}

ul үшін мәндер

Мән	Сипаттама
`circle`	Шеңберлер түріндегі маркерлерді жасайды.
`disc`	Боялған шеңберлер түріндегі маркерлерді жасайды.
`square`	Кішкентай шаршылар түріндегі маркерлерді жасайды.
`none`	Маркерлерді алып тастайды.

Әдепкі мән: disc.

ol үшін мәндер

Мән	Сипаттама
`armenian`	Дәстүрлі армян нөмірлеуі.
`decimal`	Араб сандары.
`decimal-leading-zero`	Оннан кіші сандар үшін алдында нөлі бар араб сандары.
`georgian`	Дәстүрлі грузин нөмірлеуі.
`lower-alpha`	Кіші латын әріптері.
`lower-greek`	Кіші грек әріптері.
`lower-latin`	Бұл мән lower-alpha-ға ұқсас.
`lower-roman`	Кіші регистрдегі рим сандары.
`upper-alpha`	Бас латын әріптері.
`upper-latin`	Бұл мән upper-alpha-ға ұқсас.
`upper-roman`	Баc регистрдегі рим сандары.
`none`	Маркерлерді алып тастайды.

Әдепкі мән: decimal.

Мысал

<ul>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ul>

ul {
	list-style-type: disc;
}

Мысал

<ul>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ul>

ul {
	list-style-type: circle;
}

Мысал

<ul>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ul>

ul {
	list-style-type: square;
}

Мысал

<ul>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ul>

ul {
	list-style-type: none;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: decimal;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: armenian;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: decimal-leading-zero;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: georgian;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: lower-alpha;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: lower-greek;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: lower-latin;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: lower-roman;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: upper-alpha;
}

Мысал

<ol>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ol>

ol {
	list-style-type: upper-roman;
}

Мысал

Бұл мысал color сипаттамасының тек мәтін түсіне ғана емес, сонымен қатар маркерлердің түсіне де әсер ететінін көрсетеді:

<ul>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
	<li>тізім нәрсесі</li>
</ul>

ul {
	list-style-type: disc;
	color: red;
}

Сондай-ақ қараңыз

list-style-image сипаттамасы,
ол берілген суреттер түріндегі маркерлерді орнатады
list-style-position сипаттамасы,
ол маркерлердің орналасуын орнатады
list-style сипаттамасы,
ол маркерлер үшін қысқарту болып табылады