Tạo kiểu danh sách bằng CSS
Danh sách là một phần rất quan trọng của nhiều trang web.
CSS có thể tạo kiểu cho chúng bằng cách sử dụng một số thuộc tính.
list-style-type
được sử dụng để đặt một điểm đánh dấu xác định trước sẽ được sử dụng bởi danh sách:
li {
list-style-type: square;
}
Chúng tôi có rất nhiều giá trị khả thi, bạn có thể xem ở đâyhttps://developer.mozilla.org/en-US/docs/Web/CSS/list-style-typevới các ví dụ về sự xuất hiện của chúng. Một số trong những cái phổ biến nhất làdisc
,circle
,square
vànone
.
list-style-image
được sử dụng để sử dụng hình ảnh tùy chỉnh làm điểm đánh dấu, khi điểm đánh dấu xác định trước không thích hợp:
li {
list-style-image: url(list-image.png);
}
list-style-position
cho phép bạn thêm điểm đánh dấuoutside
(mặc định) hoặcinside
của nội dung danh sách, trong luồng của trang chứ không phải bên ngoài nó
li {
list-style-position: inside;
}
Cáclist-style
thuộc tính viết tắt cho phép chúng tôi chỉ định tất cả các thuộc tính đó trong cùng một dòng:
li {
list-style: url(list-image.png) inside;
}
Tải xuống miễn phí của tôiSổ tay CSS
Các hướng dẫn css khác:
- Hướng dẫn Flexbox
- Hướng dẫn về CSS Grid
- Biến CSS (Thuộc tính tùy chỉnh)
- Giới thiệu về PostCSS
- Thuộc tính lề CSS
- Cách căn giữa một phần tử bằng CSS
- Phông chữ Hệ thống CSS
- Cách in HTML của bạn với phong cách
- Hướng dẫn giới thiệu về Chuyển đổi CSS
- Hướng dẫn tạo ảnh động CSS
- Giới thiệu về CSS
- Hướng dẫn CSS
- Cách thiết lập Tailwind với PurgeCSS và PostCSS
- Tờ Tailwind Cheat
- Cách xoay liên tục hình ảnh bằng CSS
- Tạo bảng phản hồi bằng CSS
- Cách gỡ lỗi CSS bằng cách chia đôi
- Bộ chọn CSS
- Xếp tầng CSS
- Đặc tính CSS
- Bộ chọn thuộc tính CSS
- Màu sắc CSS
- Đơn vị CSS
- Url CSS ()
- Kiểu chữ CSS
- Mô hình hộp CSS
- Thuộc tính vị trí CSS
- Truy vấn phương tiện CSS và thiết kế đáp ứng
- Truy vấn tính năng CSS
- Chuyển đổi CSS
- Cách tạo kiểu danh sách bằng CSS
- Tiền tố nhà cung cấp CSS
- Kế thừa CSS
- Lớp giả CSS
- Phần tử giả CSS
- Tạo kiểu bảng HTML bằng CSS
- Thuộc tính Hiển thị CSS
- Hàm calc () CSS
- Đường viền CSS
- Nhập tệp CSS bằng @import
- Xử lý lỗi CSS
- Bộ lọc CSS
- Kích thước hộp CSS
- Nền CSS
- Nhận xét CSS
- Phông chữ CSS
- CSS Padding
- Thuộc tính float CSS và thanh toán bù trừ
- Chuẩn hóa CSS
- Thuộc tính CSS z-index
- Cách tắt lựa chọn văn bản bằng CSS
- Cách đặt một mục ở dưới cùng của vùng chứa bằng CSS
- Cách đảo màu bằng CSS
- Các thẻ pre đáp ứng trong CSS
- Nhúng video YouTube thích ứng
- Giá trị Điểm ngắt CSS tốt cho Thiết kế đáp ứng là gì?
- Cách căn giữa trong flexbox