Home » CSS » [CSS Tutorial] Bài 9: div và span

[CSS Tutorial] Bài 9: div và span

This entry is part 9 of 9 in the series CSS

div và span là hai thẻ chúng ta thường dùng trong HTML để sắp xếp các phần tử trên trang web. Trong CSS, thẻ div và span có vai trò như thế nào?

div và span giống và khác nhau thư thế nào?

Đầu tiên, thẻ div và span là các thẻ trung hòa vì nó không định dạng chữ hay các đối tượng được nó bao quanh.

Khác nhau đầu tiên, div thuộc nhóm thẻ block trong khi đó span thuộc nhóm thẻ inline.

Khác nhau thứ hai, div có thể bao quan nhiều thẻ div hoặc các thẻ khác, còn thẻ span thì không.

Sử dụng thẻ div và span trong CSS:

Do đặc tính trung hòa của mình nên thẻ div và span được sử dụng để định dạng CSS. Để định dạng thẻ div và span, ta dùng class hoặc id.

Ví dụ: Ta trang HTMl sử dụng thẻ div có class=”menu” như sau:

Khi đó, sử dụng CSS để  định dạng chữ trong #menu có kích thước 14px và font arial như sau:

 Ví dụ: Tạo trang  HTML sử dụng thẻ spanclass=”boldtext” để nhấn mạnh chữ cần thiết như sau:

Khi đó, các phần thuộc class boldtext sẽ được in đậm và có màu xanh bằng CSS sau:

Nếu bạn vẫn chưa hiểu rõ, có thể tải các source code demo trong bài viết ngay phía dưới. 🙂

Source code demo div Source code demo span
Series Navigation<< [CSS Tutorial] Bài 8: Class và id
Share
Share
Free WordPress Themes - Download High-quality Templates