Thứ bậc trong XHTML
- October 12, 2008
- 7 comments
Thứ bậc trong XHTML là một khái niệm rất quan trọng mà bạn cần nắm rõ để sử dụng CSS sau này. Thứ bậc của XHTML giống như phả hệ của một gia đình vậy. Ở trên cùng là cụ tổ, xuống dưới là cụ, ông, cha, chú, anh chị em …
Ở hình ví dụ trên bạn sẽ thấy rõ ràng mối liên hện giữa các thẻ với nhau và chúng ta có thể hiểu bằng những cách sau (suy diễn theo kiểu phả hệ):
- Thẻ <body> đóng vai trò là thẻ gốc và chứa các thẻ con nằm trong nó.
- Các thẻ p, h1 và img là con của body
- Hay nói cách khác body chính là cha của p,h1 và img.
- ul là cha của li hay nói cách khác li là con của ul
- <body> là “ông nội” của <ul> và là ông cố của <li>
Đến đây bạn có thể hỏi “tại sao tôi cần phải biết phả hệ này?”, tại vì sau này khi sử dụng CSS để thiết kế giao diện. Đôi khi bạn cần hướng tới một đối tượng cụ thể nào đó trong đoạn code XHTML, nếu bạn không nắm rõ mối liên quan giữa các thẻ với nhau. Có thể bạn sẽ bị nhầm lẫn và hướng tới sai đối tượng.
Ví dụ sau này trong đoạn code của bạn có nhiều thẻ <h1> nhưng bạn chỉ muốn thẻ <h1> nằm trong phần “content” là có màu đỏ. Lúc đó bạn có thể hướng tới nó nhờ cấp bậc của XHTML. Nếu cho đoạn code sau
#content h1 {color:red;}
Như thế chỉ có thẻ <h1> thuộc thẻ <div id=”content”> sẽ bị ảnh hưởng, còn các thẻ khác trong trang web sẽ không bị ảnh hưởng vì nó không phải là một thành phần của <div id=”content”>
Có nhiều người chưa hiểu rõ cấp bậc của XHTML nên họ gặp nhiều khó khăn trong việc hướng đối tượng khi viết code. Vì thế họ đã tuỳ tiện dùng ID và Class chỉ để hướng tới một đối tượng cụ thể, mà nếu nắm rõ khái niệm cấp bậc này, bạn chỉ cần viết một đoạn code nhỏ thay vì có hàng tá ID và Class không cần thiết.
« Hướng đối tượng dựa vào cấp bậc XHTML
bài viết hay quá em đang học về css ma thấy lung bung.
thanks you very much.
[...] H?c thi?t k? web theo chu?n. » CSS … other posts by admin [...]
html là ngôn ngữ cơ bản nhất để xây dưng 1 trang web phải không mấy anh.
em mới tập html. mấy anh chỉ em biết khi học thiết kế web thì học theo những bước nào
thanks
anh làm cho em hướng dẫn làm write_url dc không ạ mong anh nhiều
Khi viết HTML cần sử dụng Tab để thụt vô, y chang như viết C.
Như vậy thì code của các bạn sẽ dễ đọc hơn, và phân chia thứ bậc rõ ràng hơn.
Ví dụ:
- <p><strong>Hy vọng không thành kẻ sì-pam</strong></p> <~~~ cái này đúng
- <p><body>Hy vọng không thành kẻ sì-pam</body></p> <~~~ cái này sai
Anh ơi, anh cho em hỏi?
Giờ em muốn biết bên trong 1 thẻ thì có thể có được những thẻ nào, thì em xem ở đâu vậy anh?
Ví dụ: Tìm hoài không thấy <~~~ cái này đúng
Không lẽ, bó tay <~~~ cái này sai
Mong anh giúp đỡ, em thanks.