Tags:

Nhóm thẻ danh sách (List) trong HTML

By Unknown → 20/11/14
Mời các bạn truy cập iZdesigner.com để cập nhật những thông tin, thủ thuật mới nhất về Web-Designer.

Chào mừng các bạn tiếp tục đến với các bài hướng dẫn cơ bản HTML tại Blog Designer. Trong bài này, chúng ta sẽ cùng tìm hiểu cách tạo một danh sách trên trang web của mình như thế nào.
I-Danh sách không theo thứ tự: <ul></ul> (Unordered List)
<ul></ul> tags dùng để tạo danh sách không theo thứ tự, tag này gồm có thuộc tính và thành phần tạo danh sách.

1-Cú pháp:
<ul thuộc tính="giá trị">
<li>Mục trong danh sách</li>
<li>Mục trong danh sách</li>
<li>............................</li>
</ul>

Trong đó:

  • <ul> :khai báo một danh sách sẽ được dùng.
  • Thuộc tính: type=
  • <li> :Thành phần khai báo mục của danh sách. Giá trị: type="ký tự"
  • </li> :Tag đóng mục. (Tag này là tùy chọn, không cần đóng cũng được.)
  • </ul> :Tag đóng.
Mặc nhiên, khi một danh sách được khai báo thì mục đầu tiên sẽ tự động xuống 1 hàng vào thụt lề.

2-Giá trị thuộc tính của Tag: <ul></ul>
  • <ul type="1"> : Bắt đầu danh sách theo thứ tự 1,2,3.(mặc nhiên)
  • <ul type="square"> : Danh sách bắt đầu là các chấm vuông đen.
  • <ul type="circle"> : Danh sách bắt đầu là vòng tròn rỗng.
  • <ul type="square"> : Danh sách bắt đầu là 1 vòng tròn đen.
  • <ul type="I"> Danh sách bắt đầu số La Mã hoa.
  • <ul type="i"> : Danh sách bắt đầu số La Mã thường.
  • <ul type="A"> : Danh sách bắt đầu chữ cái Hoa.
  • <ul type="A"> : Danh sách bắt đầu chữ thường.
Xem ví dụ:

3-Tạo danh sách nhiều tầng:

Để tạo danh sách nhiều tầng, bạn có thể lồng một danh sách vào trong một danh sách.

Xem ví dụ:

II-Danh sách thứ tự: <ol></ol>(Ordered List)
Dùng <ol></ol> Ordered List để tạo danh sách theo thứ tự số hoặc chữ. Cũng giống như khai báo của <ul></ul>, nhưng cặp tags này còn có thêm thuộc tính Start và giá trị.

Ví dụ:



Các giá trị thuộc tính của type=:

  • <ol type="1" start="10"> :Bắt đầu bằng 10, kế tiếp là 11, 12, 13...
  • <ol type="square"> : Danh sách bắt đầu là các chấm vuông đen.
  • <ol type="circle"> : Danh sách bắt đầu là vòng tròn rỗng.
  • <ol type="square"> : Danh sách bắt đầu là 1 vòng tròn đen.
  • <ol type="I" start="5"> :Danh sách bắt đầu số La Mã hoa, kế tiếp là VI, VII, VIII...
  • <ol type="i"> : Danh sách bắt đầu số La Mã thường, kế tiếp là vi, vii, viii...
  • <ol type="A" start="3"> : Danh sách bắt đầu chữ cái Hoa, kế tiếp là C, D, E....
  • <ol type="a"> : Danh sách bắt đầu chữ thường, kế tiếp là b,c,d...
Bạn cũng có thể tạo danh sách nhiều tầng sử dụng cặp Tags này hoặc kết hợp với Unodered List. Cách tạo tương tự như ví dụ trong mục I.

III-Tạo Danh sách Định nghĩa:
Một ứng dụng tạo danh sách quan trọng là tạo danh sách các định nghĩa, giải thích thuật ngữ. Chúng ta có 3 cặp tags để làm công việc này như sau:
  • <dl></dl> : Tags tạo danh sách định nghĩa. (Definition List)
  • <dt></dt> : Tags hiển thị thuật ngữ sẽ được định nghĩa. (Definition Term)
  • <dd></dd>: Tags hiển thị định nghĩa của thuật ngữ. (Definition Description)
Ví dụ:

IV-Thực hành:
Bạn có thể mở Notepad, gõ vào các ví dụ trên và lưu với tên tập tin list.html. Bạn cũng có thể định dạng chữ cho các thành phần trong danh sách bằng tất cả các tags định dạng như <font> hoặc <b>...Hãy sáng tạo.

Tags:

Blog Designer

Hãy cho đi rồi sẽ nhận lại nhiều hơn thế

Đã có nhiều lúc tôi không biết mình sẽ làm được gì ??? Nhưng hãy cứ tin vào chính bản thân mình, tin vào mọi người và đừng để con tim bạn lạc lối. Bạn và tôi sẽ tìm ra được đâu là đích đến để mình biết đường đi.Nếu bạn cần một người bạn, đừng ngại kết bạn với tôi.

Thư Viện Đồ Họa: www.izdesigner.com