Thuộc tính list-style-type

Thuộc tính list-style-type cho phép đối với danh sách ul thay vì các dấu chấm tròn có thể tạo thành hình vuông hoặc hình tròn. Đối với danh sách ol thay vì các số thông thường có thể tạo số La Mã, đánh số dưới dạng chữ cái: Latinh hoặc Hy Lạp.

Cú pháp

bộ chọn {
	list-style-type: giá trị;
}

Giá trị cho ul

Giá trị	Mô tả
`circle`	Tạo điểm đánh dấu dưới dạng hình tròn.
`disc`	Tạo điểm đánh dấu dưới dạng hình tròn được tô đặc.
`square`	Tạo điểm đánh dấu dưới dạng hình vuông.
`none`	Loại bỏ các điểm đánh dấu.

Giá trị mặc định: disc.

Giá trị cho ol

Giá trị	Mô tả
`armenian`	Đánh số truyền thống Armenia.
`decimal`	Chữ số Ả Rập.
`decimal-leading-zero`	Chữ số Ả Rập với số 0 đứng trước cho các chữ số nhỏ hơn mười.
`georgian`	Đánh số truyền thống Georgia.
`lower-alpha`	Chữ cái Latinh viết thường.
`lower-greek`	Chữ cái Hy Lạp viết thường.
`lower-latin`	Giá trị này tương tự như lower-alpha.
`lower-roman`	Số La Mã viết thường.
`upper-alpha`	Chữ cái Latinh viết hoa.
`upper-latin`	Giá trị này tương tự như upper-alpha.
`upper-roman`	Số La Mã viết hoa.
`none`	Loại bỏ các điểm đánh dấu.

Giá trị mặc định: decimal.

Ví dụ

<ul>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ul>

ul {
	list-style-type: disc;
}

Ví dụ

<ul>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ul>

ul {
	list-style-type: circle;
}

Ví dụ

<ul>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ul>

ul {
	list-style-type: square;
}

Ví dụ

<ul>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ul>

ul {
	list-style-type: none;
}

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

ol {
	list-style-type: decimal;
}

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

ol {
	list-style-type: armenian;
}

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

ol {
	list-style-type: georgian;
}

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

<ol>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ol>

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

Ví dụ

Ví dụ này cho thấy thuộc tính color ảnh hưởng không chỉ đến màu văn bản, mà còn đến màu của các điểm đánh dấu:

<ul>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
	<li>mục danh sách</li>
</ul>

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

Xem thêm

thuộc tính list-style-image,
thiết lập các điểm đánh dấu dưới dạng hình ảnh được chỉ định
thuộc tính list-style-position,
thiết lập vị trí của các điểm đánh dấu
thuộc tính list-style,
là thuộc tính viết tắt cho các điểm đánh dấu