f [Tự Học HTML] Bài 6: Thẻ DIV và Thẻ SPAN ~ Thiết Kế Web Giá Rẻ - GiaLinhIT's Blog

connect.facebook.net connect.facebook.net

Thứ Hai, 7 tháng 7, 2014

[Tự Học HTML] Bài 6: Thẻ DIV và Thẻ SPAN

Tiếp theo loạt bài về Tự Học HTML hôm nay chúng ta sẽ tìm hiểu DIV và SPAN.

1. Thẻ SPAN ( SPAN tag):

Là một thẻ thuộc nhóm thẻ nội tuyến dùng để chứa các đoạn văn bản mà bạn muốn nhấn mạnh, thẻ này có tính chất trung hòa và không làm thay đổi tài liệu HTML.
Nhưng span sẽ thể hiện đẳng cấp của mình khi sử dụng kết hợp với CSS.
Ví dụ:
Xét câu sau: Một trong những nguyên tắc của phối  màu trong thiet ke giao dien web là tránh sử dụng quá nhiều màu khác nhau.
Code HTML:
Trình duyệt hiển thị:
the div dung de thiet ke giao dien web
Các bạn hãy thử định dạng cho đoạn text trên với CSS và không dùng với span để tự khám phá sự khác nhau nhé.

2. Thẻ DIV (DIV tag):

Thẻ <DIV> là viết tắt của từ "division" nghĩa là "phân chia", <div> thuộc nhóm thẻ dạng khối và có tính chất trung hòa như thẻ <span> và thường sử dụng để phân các khối với nhau, kết hợp với CSS.
DIV thường dùng để thiết kế giao diện website, một giao diện website sẽ chia thành nhiều phần nhờ các div. ( sẽ có một bài về vấn đề này).
Các thẻ <div> có thể chứa lẫn nhau, khác với span nhóm đơn khối thì <div> nhóm được đa khổi.
Cú pháp:
<div thuoctinh="giatri"></div>
Ví dụ:
tu hoc html the div thiet ke giao dien web


Tuy nhiên với đoạn code trên bạn chưa thể nhận ra điểm mạnh của <div> mà phải thông qua các thuộc tính.
Một số thuộc tính quan trọng của thẻ div là: id, class, style... các bạn sẽ được học kỹ và ứng dụng nó triệt để trong phần Tự Học CSS.
Chú ý: Không nên sử dụng thẻ <div> cho những chi tiết nhỏ như một đoạn text, một hình ảnh....tất nhiên sử dụng thì trình duyệt vẫn sẽ hiển thị đúng ý đồ người code nhưng lại làm sai lệch ý nghĩa của thẻ <div>.
Bài này là bài kết thúc phần Tự Học HTML và chủ yếu làm nền tảng cho những phần CSS nên mình không đưa ra bài tập thực hành.
Chúc các bạn học tốt!

0 nhận xét:

Đăng nhận xét