logo

AnonyHome

Loading...

Register

Chưa phân loại - 2017-12-02

[Series Html] Bài 5. Danh sách ( list)

[Series Html] Bài 5. Danh sách ( list)- Danh sách trong html - AnonyHome


– Trong HTML có 3 loại danh sách:
+ ol: ordered list: Danh sách có đánh trật tự.
+ ul: unordered list: Danh sách không đánh trật tự.
+ dl: definition list: Danh sách định nghĩa.
– Ngoài để tạo danh sách các thẻ trên còn sử dụng để xây dựng hệ thống Menu của website.
– Bên trong các cặp thẻ <ol></ol> , <dl></dl> <ul></ul> là các cặp thẻ <li></li> hay <dd></dd> và <dt></dt> .

1. Danh sách có trật tự <ol></ol>.

Tạo nên danh sách có đánh thứ tự 1, 2, 3,…bên trong là các cặp thẻ định nghĩa danh sách <li></li>  .
 Ví dụ:

[Series Html] Bài 5. Danh sách ( list)- Danh sách trong html - AnonyHome


– Có thể thay đổi cách hiển thị khi sử dụng <ol> bằng cách sử dụng thuộc tính type.
+ a: Hiển thị theo kiểu ký tự thường a, b, c…
+ A: Hiển thị theo dạng ký tự hoa A, B, C..
+ i: Hiển thị dạng La Mã thường i, ii, iii, iv,..
+ I: Hiển thị dang La Mã I, II, III, IV,..
+ square: Hình ô vuông.
+ circle: Hình tròn màu rỗng ( màu trắng).
+ disc: Hình tròn đặc( chấm tròn màu đen).
– Để bắt đầu với 1 giá trị khác 1 chúng ta sử dụng thuộc tính start=“n” với n là giá trị bắt đầu của danh sách.  
Ví dụ:



2. Danh sách không trật tự <ul></ul>.

– Là kiểu danh sách đánh thứ tự các list mặc định là các hình tròn đặc ( chấm tròn đen).
– Có thể tùy biến sang các kiểu khác: đánh trật tự, ô vuông, hình tròn rỗng,..Tương tự như đối với <ol></ol>
– Để loại bỏ các kiểu đánh thứ tự đối với 2 loại “ol” và “ul” chúng ta sử dụng thuộc tính type với giá trị là none.  



dụ:


3. Danh sách định nghĩa.

– Khác với “ol” và “ul”, cặp thẻ <dl></dl> được dùng để định nghĩa 1 đối tượng nào đó.
– Bên trong cặp thẻ “dl” chứa các cặp thẻ:
+ “dd” (Definition Description): Thẻ mô tả định nghĩa
+ “dt” ( Definition term): Thẻ định nghĩa 1 thuật ngữ nào đó.

Kết thúc bài 5 tại đây. Trong bài mình đã giới thiệu cho các bạn về danh sách( list ) trong Html. Trong bài học tiếp theo chúng ta sẽ nghiên cứu về biểu mẫu(form ) trong Html.

Chúc các bạn học tập tốt! Mọi ý kiến các bạn vui lòng để lại trong mục bình luận bên dưới.

Nhận bài viết mới qua email

Chuyên mục HOT

Chuyên mục tìm hiểu ioT

Xem thêm

Popular

Newest

Related

AnonyHome ra mắt nền tảng học lập trình trực tuyến

2020-09-04

Chia sẻ tài liệu lập trình Android Full – FPT Software

2020-06-21

Chia sẻ Khóa học xây dựng ứng dụng triệu người xài Android Realtime với Firebase qua 5 dự án

2020-06-27

Khóa học lập trình Android Kotlin toàn tập 2020

2020-07-01

Tài liệu Java Spring MVC – Đại học FPT

2020-06-23

Full source code+Database: Quản lý thư viện+Báo cáo chi tiết

2020-02-26

Chia sẻ tài liệu học Lập trình ARM STM32, STM8, vv

2020-03-05

Chia sẻ bộ video Tự Học Angular Tiếng Việt

2020-06-29

AnonyHome ra mắt nền tảng học lập trình trực tuyến

2020-09-04

Chia sẻ code quản lý khoá học và học viên PHP MYSQL

2021-02-25

Bài giảng Java – Chương 3 phần 1

2021-02-24

Bài giảng Java – Chương 2 phần 2

2021-02-04

Bài giảng Java – Chương 2 phần 1

2021-01-22

Sự khác biệt giữa next() và nextLine() trong Java

2021-01-22

Chương 1: Giới thiệu về Java

2021-01-13

Hướng dẫn cài đặt môi trường Java và Eclipse

2021-01-12

AnonyHome ra mắt nền tảng học lập trình trực tuyến

2020-09-04

Chia sẻ code quản lý khoá học và học viên PHP MYSQL

2021-02-25

Bài giảng Java – Chương 3 phần 1

2021-02-24

Bài giảng Java – Chương 2 phần 2

2021-02-04

Bài giảng Java – Chương 2 phần 1

2021-01-22

Sự khác biệt giữa next() và nextLine() trong Java

2021-01-22

Chương 1: Giới thiệu về Java

2021-01-13

Hướng dẫn cài đặt môi trường Java và Eclipse

2021-01-12