[ Tin nhắn mới · Thành viên · Quy tắc diễn đàn · Tìm kiếm · RSS]
THỐNG KÊ DIỄN ĐÀN
BÀI VIẾT MỚICHỦ ĐỀ SÔI ĐỘNGTHÀNH VIÊN TÍCH CỰCTHÀNH VIÊN MỚI
  • Chồng Nhâm Thâ... (1)
  • Bộ sách về tử ... (1)
  • Thuốc chữa bện... (1)
  • Bệnh nhiệt miệ... (0)
  • Tạo màng ngăn ... (0)
  • Tổng Hợp về YA... (13)
  • Tăng font chữ ... (13)
  • Tử vi năm Nhâm... (11)
  • Phong thủy cho... (10)
  • Thái cực quyền... (8)
  • TieuBao
  • kcdl
  • havanchan55
  • minzjkute
  • 12a3
  • adjmkun60
  • thaybalau
  • huyenntn17fsoft
  • trininh0610
  • linhphuongcva
    • Page 1 of 1
    • 1
    DIỄN ĐÀN_VNTAMTAY » THƯ VIỆN WEBSITE » MÃ HTML & JAVASCRIPT » Bài 9: html lists - danh sách (html lists - danh sách)
    Bài 9: html lists - danh sách
    TieuBaoNgày: Thứ 5, 07-Apr-11, 20:35:37 | Bài viết # 1


    Nhóm: Administrator
    Số bài viết: 3090
    Khen thưởng: 3
    Được cảm ơn: 10001
    Trạng thái: Offline
    html lists - danh sách

    Có ba loại list:

    <ul> - unordered list; bullets
    <ol> - ordered list; numbers
    <dl> - definition list; dictionary

    Nhưng mà chỉ dùng đa số là <ol> và <ul>, cái <dl> nói thiệt chả thấy gì khác biệt cho lắm! Nhưng tag <ol> thì có tính tuỳ biến cao nhất!
    bên trong danh sách luôn có những à...ờ....nói chung là danh sách. Xem ví dụ sẻ rỏ:

    <ul> list
    Code: [Select]
    <ul>
    <li>Nguyễn Văn Tí</li>
    <li>Trần Văn Trội</li>
    <li>Quách yên Quẩy</li>
    </ul>

    Kết quả:

    * Nguyễn Văn Tí
    * Trần Văn Trội
    * Quách yên Quẩy

    <ol> list
    Code: [Select]
    <ol>
    <li>Nguyễn Văn Tí</li>
    <li>Trần Văn Trội</li>
    <li>Quách yên Quẩy</li>
    </ol>

    Kết quả:

    1. Nguyễn Văn Tí
    2. Trần Văn Trội
    3. Quách yên Quẩy

    <dl> list
    Code: [Select]
    <dl>
    <li>Nguyễn Văn Tí</li>
    <li>Trần Văn Trội</li>
    <li>Quách yên Quẩy</li>
    </dl>

    Kết quả:

    # Nguyễn Văn Tí
    # Trần Văn Trội
    # Quách yên Quẩy

    Qua ví dụ bạn sẽ thấy <dl> và <ul> không có gì khác nhau! Nhưng đó là bởi vì ta chưa hề thêm sự tuỳ biến vào.

    Tuỳ chỉnh thêm cho list
    Phần này đa số ta xoáy vào <ol> list

    Bạn thấy với ví dụ trên của <ol> list, list đó bắt đầu với 1, rồi tới 2,3...... Ta có thể để list này bắt đầu với một số tuỳ chọn, trong ví dụ này mình bắt đầu với 4

    Code: [Select]
    <ol start="4">
    <li>Nguyễn Văn Tí</li>
    <li>Trần Văn Trội</li>
    <li>Quách yên Quẩy</li>
    </ol>

    Kết quả:

    4. Nguyễn Văn Tí
    5. Trần Văn Trội
    6. Quách yên Quẩy

    Trong list <ol> không những có thể đánh số thứ tự bằng số, mà còn có thể đánh số thứ tự với chữ cái hoặc số La Mã bằng cách thêm thuộc tính type với giá trị theo sau: a,A,i,I
    a,A sẽ đánh thứ tự theo chữ cái, nhưng khác nhau là a in thường, A in hoa.
    Tương tự như thế với i và I

    Ví dụ:
    Code: [Select]
    <ol type="a">
    <li>Mỹ</li>
    <li>Nhật</li>
    <li>Pháp</li>
    <li>Đức</li>
    <li>Anh</li>
    </ol>

    kết quả:

    1. Mỹ
    2. Nhật
    3. Pháp
    4. Đức
    5. Anh

    Những cái khác các bạn có thể tự hiểu mà không cần ví dụ rồi ha!

    Còn với <ul> list, ta lại có một số giá trị của thuộc tính type giúp định dạng cái dấu, các giá trị đó là: type="square",type="disc",type="circle"

    Ví dụ thử cái square
    Code: [Select]
    <ul type="square">
    <li>Mỹ</li>
    <li>Nhật</li>
    <li>Pháp</li>
    <li>Đức</li>
    <li>Anh</li>
    </ul>

    Kết quả

    * Mỹ
    * Nhật
    * Pháp
    * Đức
    * Anh

    Trong list bạn còn có thể thụt ra thụt vô bằng cách dùng các thẻ <dt> và <dd>

    Code: [Select]
    <ul type="square">
    <li>Mỹ</li>
    <li>Nhật</li>
    <li>Pháp</li>
    <li>Đức</li>
    <li>Anh</li>
    <dt>Hàn Quấc</dt>
    <dd>Trung Quấc</dd>
    </ul>

    Kết quả:

    * Mỹ
    * Nhật
    * Pháp
    * Đức
    * Anh
    Hàn Quấc
    Trung Quấc

    Và dĩ nhiên bạn cũng có thể lồng list vào list
    Code: [Select]
    <ol>
    <li>Châu Mỹ</li>
    <ol type="a">
    <li>Mỹ</li>
    <li>Brazil</li>
    </ol>
    <li>Châu Âu</li>

    <ul>
    <li>Anh</li>
    <li>Pháp</li>
    </ul>

    <li>Châu Á</li>

    <ul type="square">
    <li>Trung Quấc</li>
    <li>Nhật Bản</li>
    </ul>

    </ol>

    Kết quả:

    1. Châu Mỹ
    1. Mỹ
    2. Brazil
    2. Châu Âu
    * Anh
    * Pháp
    3. Châu Á
    * Trung Quấc
    * Nhật Bản

    bấy nhiêu đây cũng đả dủ để kết thúc phần html list rồi ha!


    TRẺ DÙNG SỨC KHỎE KIẾM TIỀN-GIÁ DÙNG TIỀN MUA SỨC KHỎE

    NHỮNG GÌ CON NGƯỜI KHÔNG NGHĨ TỚI LẠI XẢY RA TRONG ĐỜI
     
    DIỄN ĐÀN_VNTAMTAY » THƯ VIỆN WEBSITE » MÃ HTML & JAVASCRIPT » Bài 9: html lists - danh sách (html lists - danh sách)
    • Page 1 of 1
    • 1
    Search:

    click ủng hộ vntamtay
    Chát với Tôi
    300
    Liên kết quảng cáo
    Buôn bán phụ tùng!
    Đang truy cập
    Khu đăng nhập
    Video Clip
    00:01:25

    Ford — StreetKa (featuring Kylie Minogue)

    • Views:
    • Total comments: 0
    • Rating: 0.0
    Tỷ giá tiền tệ