Học HTML, CSS từ Zero Tới Hero
- Styles mặc định
- Marker là gì?
- Thẻ ul
- Thẻ ol
Styles mặc định
Mặc định các trình duyệt sẽ thêm một khoảng đệm vào bên trái các danh sách. Điều này có tác dụng giúp cho danh sách được hiển thị thụt vào một chút so với nội dung các đoạn văn.
Ví dụ:
Trong trường hợp các thẻ danh sách lồng nhau, tính chất này giúp các danh sách con được thụt lề hơn so với danh sách cha.
Ví dụ:
Cũng giống như thẻ <p>, trình duyệt cũng mặc định thêm vào trên và dưới thẻ danh sách một khoảng trống (margin trong CSS). Bạn sẽ thấy rõ điều này khi để từ 2 danh sách nối đuôi nhau.
Ví dụ:
Marker là gì?
Marker là điểm dùng để đánh dấu các đầu mục trong danh sách (xem các ví dụ ở phần trên). Tùy vào loại danh sách hoặc cấp độ của danh sách thì marker được tự động thay đổi.
Thẻ ul
Đây là cách hoạt động mặc định của marker trên thẻ <ul>:
- Cấp 1 hiển thị chấm tròn
- Cấp 2 hiển thị vòng tròn
- Từ cấp 3 trở đi hiển thị chấm vuông
Ví dụ:
Thẻ ol
Đối với thẻ <ol> thì mọi cấp độ mặc định marker đều hiển thị số, bắt đầu từ 1 và tăng dần sau đó.
Ví dụ:
Ngoài ra, thẻ <ol> có thêm một số thuộc tính:
reversedđể đảo ngược chiều đếm số. Thay vì1, 2, 3sẽ thành3, 2, 1.startđặt giá trị bắt đầu, mặc định là1.typeđặt kiểu chomarker:1số tự nhiênabảng chữ cái, chữ thườngAbảng chữ cái, chữ in hoaisố La Mã, chữ thườngIsố La Mã, chữ in hoa
Ví dụ sử dụng các thuộc tính này mình có nói trong video ở trên nhé.
Tóm tắt
- Mặc định các trình duyệt sẽ thêm một khoảng đệm vào bên trái các danh sách.
- Điều này có tác dụng giúp cho danh sách được hiển thị thụt vào một chút so với nội dung các đoạn văn.
- Trong trường hợp các thẻ danh sách lồng nhau, tính chất này giúp các danh sách con được thụt lề hơn so với danh sách cha.
- Cũng giống như thẻ
<p>, trình duyệt cũng mặc định thêm vào trên và dưới thẻ danh sách một khoảng trống (margin trong CSS). Bạn sẽ thấy rõ điều này khi để từ 2 danh sách nối đuôi nhau. - Marker là điểm dùng để đánh dấu các đầu mục trong danh sách, chúng ta có thể thay đổi được styles này trong CSS.
Nhận xét