HTML là ngôn ngữ cơ bản cần phải học để thiết kế website. Bạn có thể xây dựng nội dung website hay không là nhờ vào HTML. Nó gần như là một thành phần không thể thiếu trong mọi trang web.
HTML là kiến thức quan trọng đầu tiên đối với tất cả các bạn khi bắt đầu học lập trình web. Nó là nền tảng vô cùng quan trọng đối với một trang web. Tại sao HTML lại đóng vai trò quan trọng đối với một trang web ? Ở bài viết này chúng ta cùng nhau đi làm rõ vấn đề này.
Vậy HTML là gì?
Hiểu đơn giản: HTML là thành phần dùng để xây dựng nội dung giao diện cho website.
Về định nghĩa:
- HTML là ngôn ngữ dùng để mô tả một trang web.
- HTML viết tắt của từ Hyper Text Markup Language.
- HTML không phải là ngôn ngữ lập trình, html là ngôn ngữ đánh dấu (markup language), ngôn ngữ đánh dấu là một nhóm các thẻ đánh dấu (các tag), HTML sử dụng các thẻ này để mô tả trang web.
- Nhóm các thẻ block, các thẻ này dùng để sắp xếp bố cục cho trang web.
- Nhóm các thẻ inline, là những thẻ cơ bản nhất, chỉ chứa được các thẻ inline cùng cấp hoặc text.
Khi sử dụng các thẻ block, trình duyệt sẽ sắp xếp các thẻ theo chiều dọc, mỗi thẻ sẽ chiếm vùng không gian nằm ngang từ trên xuống theo thứ tự sắp xếp trong trang HTML/XHTML, thẻ nào code trước sẽ nằm trên, các thẻ code sau sẽ nằm bên dưới.
Xem ví dụ sau đây để thấy được trình duyệt sắp xếp các thẻ theo chiều ngang như thế nào:
Viết code HTML:
<h1>Tiêu đề 01</h1> <ul> <li><a href="#">Link 01</a> <li><a href="#">Link 02</a> <li><a href="#">Link 03</a> <li><a href="#">Link 04</a> <li><a href="#">Link 05</a> </ul> <div>Nội dung chính</div> <div>Nội dung phụ</div> <div> <p>Tên công ty</p> <p>Địa chỉ</p> </div>
Hiển thị trên trình duyệt:
Phân tích vị trí của các thẻ:
Ta thấy các thẻ block đều chiếm vùng không gian nằm ngang, chúng ta có thể sắp xếp lại vị trí của các thẻ block bằng cách sử dụng các thuộc tính css.
Sự sắp xếp chiều ngang của thẻ inline trong HTML
Khi sử dụng các thẻ inline, trình duyệt sẽ sắp xếp các thẻ liền kề nhau theo chiều ngang, thẻ nào code trước xuất hiện trước, thẻ nào code sau xuất hiện sau.
Xem ví dụ sau đây để thấy được trình duyệt sắp xếp các thẻ inline như thế nào:
Viết code HTML:
<a href="#">Thẻ a</a> thẻ span <em>thẻ em</em> <strong>thẻ strong</strong>
Hiển thị trên trình duyệt:
Tới đây chắc các bạn đã hiểu nhiệm vụ của HTML/XHTML dùng để làm gì, đối với các thẻ block trình duyệt sẽ sắp xếp nó theo chiều dọc, đối với các thẻ inline trình duyệt sẽ sắp xếp theo chiều ngang, nếu muốn hiểu rõ hơn các bạn có thể tham khảo thêm các vùng không gian HTML.
Nhiệm vụ của trình duyệt (Firefox, Internet Explorer, Safari, Opera, Chrome,...) là đọc văn bản HTML và hiển thị chúng như chúng ta thấy, tuy nhiên các trình duyệt không hiển thị các thẻ HTML (các tag), nhưng lại sử dụng các thẻ để giải thích nội dung cho trang web.
Cảm ơn tất cả các bạn đã dành thời gian xem bài viết của Tungcoder.blogspot.com, rất mong nhận được sự ủng hộ cũng như những ý kiến đóng góp của các bạn!
Nếu bài viết hữu ích với bạn đừng quên để lại 1 nhận xét và chia sẽ bài viết này cho bạn bè cùng biết nhé!
Xin chào và chúc thành công!!!
