Thanh Dương xin chào

12 khách và 0 thành viên

Ảnh ngẫu nhiên

BannerHongAnh.swf 270.jpg Mungxuan.swf Happy_new_year.swf _NGUOI_THAY__NHAT_HUY.swf 01_TIENG_HAT_TU_TP_HO_CHI_MINH.swf Cover201115.jpg Donghosocogiay2chuden.swf Donghosocogiay2chutrang.swf Donghosocogiay12chutrang.swf Donghoso12.swf Donghoso21.swf Donghoso2.swf Donghoso1.swf Donghosocogiay1.swf Donghosocogiay.swf Donghoso.swf Clock_LienBich.swf Ad_cadao.swf Videoplayback_.flv

Tài nguyên dạy học

Điều tra ý kiến

Bạn thấy trang này như thế nào?
Đẹp
Đơn điệu
Bình thường
Ý kiến khác

Sắp xếp dữ liệu

Nhúng mã HTML

Thống kê

  • truy cập   (chi tiết)
    trong hôm nay
  • lượt xem
    trong hôm nay
  • thành viên
  • thống kê truy cập

    free counters
    Gốc > Những vấn đề về CNTT > Web > CSS >

    Bài 8: Span & Div


    Như đã hứa, ở bài học này chúng ta sẽ cùng tìm hiểu về 2 thẻ <span> và <div> 
    trong HTML và xem chúng có lợi ích gì cho công việc viết CSS của chúng ta. 
    8.1. Nhóm phần tử với thẻ <span>: 
    Thẻ <span> trong HTML thật ra là một thẻ trung hòa, nó không thêm hay bớt bất 
    cứ một thứ gì vào một tài liệu HTML cả. Nhưng chính nhờ tính chất trung hòa này 
    mà nó lại là một công cụ đánh dấu tuyệt vời để qua đó chúng ta có thể viết CSS 
    định dạng cho các phần tử mong muốn. 
    Ví dụ: Chúng ta có đoạn HTML sau trích dẫn câu nói của chủ tịch Hồ Chí Minh 
    HTML Code:
    <p>Không có gì quý hơn độc lập, tự do.</p>
    
    Yêu cầu ở đây là chúng ta hãy dùng CSS tô đậm 2 từ độc lập, tự do. Để giải quyết 
    vấn đề này, chúng ta sẽ thêm thẻ <span> vào đoạn HTML như sau: 
    HTML Code:
    <p>Không  có  gì  quý  hơn  <span  class=”nhanmanh”>độc  lập</span>,  <span class=”nhanmanh”>tự do</span>.
    
    Và bây giờ chúng ta có thể viết CSS cho yêu cầu trên: 
    HTML Code:
    .nhanmanh {  
    font-weight:bold
    }
    Rất đơn giản phải không nào. 

    8.2. Nhóm khối phần tử với thẻ <div>: 
    Cũng như <span>, <div> cũng là một thẻ trung hòa và được thêm vào tài liệu 
    HTML với mục đính nhóm các phần tử lại cho mục đích định dạng bằng CSS. Tuy 
    nhiên, điểm khác biệt là <span> dùng để nhóm một khối phần tử trong khi đó <div> 
    có thể nhóm một hoặc nhiều khối phần tử.
    Trở lại ví dụ về danh sách tỉnh, thành trong phần class bài trước chúng ta sẽ giải 
    quyết vấn đề bằng cách nhóm các phần tử với <div> như sau: 
    HTML Code:
    <p>Danh Sách Các Tỉnh, Thành Phố Việt Nam:</p> 
    <ul>
    <div id=”tp”>
    <li>Hà Nội</li>
    <li>TP. Hồ Chí Minh</li>
    <li>Đà Nẵng</li>
    </div>
    <div id=”tinh”>
    <li>Thừa Thiên Huế</li>
    <li>Khánh Hòa</li>
    <li>Quãng Ninh</li>
    <li>Tiền Giang</li>
    </div>
    </ul>
    Và đoạn CSS cho mục đích này sẽ là: 
    HTML Code:
    #tp {  
    color:#FF0000
    }
    #tinh {
    color:0000FF
    }
    Trong hai bài học trên, chúng ta đã được học qua về id, class, <div>, <span> và lợi 
    ích của nó trong việc nhóm, đánh dấu phần tử để có thể dùng CSS để tạo ra các 
    kiểu trình bày đặc biệt. Có thể một số bạn chưa học qua HTML sẽ khó khăn trong 
    việc nắm bắt các kiến thức này. Tuy nhiên, yêu cầu mà Pearl đưa ra ở đây chỉ là 
    các bạn có thể vận dụng các phần tử này trong CSS.

    Nhắn tin cho tác giả
    Đỗ Thanh Dương @ 16:26 19/03/2011
    Số lượt xem: 358
    Số lượt thích: 0 người
     
    Gửi ý kiến

    HỖ TRỢ QUẢN TRỊ WEBSITE

    Thay tên website / Chọn thư mục / Mở ra
    Giao diện Module Thư mục Thành viên Tài nguyên Xóa Code
    http://