Cú pháp html được cấu tạo bởi các thẻ có đóng mở, như cặp thẻ

Mở giao diện visual studio code, tạo file index.html để bắt đầu code

Cách tạo & cấu trúc cơ bản của một file HTML

Comment

Comment trong HTML hay bất kì ngôn ngữ lập trình nào đều rất quan trọng, giúp code dễ hiểu, dễ bảo trì và cập nhật

Cú pháp Comment trong HTML

- Nội dung comment \>

Ví dụ:

Chúng ta cùng nhau code HTML > Bạn đang theo dõi khóa học Lập trình Front End cơ bản cùa Howkteam.com >

Cấu trúc của file HTML cơ bản

Cấu trúc chung của html gồm có thẻ dùng để xác định rằng code bạn đang dùng là html

• Cặp thẻ đóng mở chứa toàn bộ các dòng lệnh html bên trong (sau này còn là code của Javascript và CSS khi chèn vào)
• Tiếp đến là 2 cặp thẻ chứa thông tin của webpage và đặc trưng bởi thẻ , mà mặc định sẽ không được hiển thị trên web
• Thẻ chứa toàn bộ nội dung html sẽ hiển thị lên trên trang web của chúng ta.

Các thẻ thường gặp trong HTML

Chúng ta tiếp tục với các thẻ thường gặp trong html

Thẻ tiêu đề

Nội dung tiêu đề

Tương tự với các thẻ h2,h3,h4,h5,h6 với cấp độ tiêu đề giảm dần

Ví dụ:

Howkteam.com

Thẻ định dạng đoạn văn bản

Nội dung đoạn văn bản chứa bên trong

Ví dụ:

Với mong muốn mang đến kiến thức chất lượng, miễn phí cho mọi người, với tâm huyết phá bỏ rào cản kiến thức từ việc giáo dục thu phí. Chúng tôi - Kteam đã lập nên trang website này để thế giới phẳng hơn. Bất cứ ai có mong muốn khai phá thế giới. Phá bỏ mọi thứ ngăn cản sự phát triển tất yếu bền vững của xã hội đều là Kter (Thành viên của Kteam). GIÁO DỤC LÀ MIỄN PHÍ!

Các thẻ mà tạo ra hiệu ứng với chữ

Ngoài các thẻ trên, HTML còn có các thẻ tạo hiệu ứng với chữ, đoạn văn bản như , , , , ,….

Và một số thẻ khác như
để cách xuống dòng,

Cùng tham khảo ví dụ bên dưới để hiểu hơn về cách sử dụng các thẻ trên

Ví dụ:

HOWKTEAM BLOG

    
HOWKTEAM
  
      
    
  
        Hello Kter    
        
   
        
  
        HOWKTEAM   
        HOWKTEAM   
        HOWKTEAM   
        Lorem, ipsum dolor sit amet consectetur adipisicing elit.  
         Rem debitis eos dolorem itaque tempore libero ipsa quibusdam fuga, vel,  
          molestiae maxime harum consequatur architecto repellat dolores cupiditate iure nisi fugiat?  
        Lorem ipsum, dolor sit amet consect 
etur adipisicing elit. Nulla, culpa.  
    
  
      

Ta được kết quả

Thẻ hình ảnh & liên kết

Thẻ

      
    Link dan den HOWKTEAM  
     
  
          
          
          
     
  

Ta được kết quả của đoạn code trên hiền thị lên trang web như sau

Kết luận

Ở bài hướng dẫn này chúng ta đã có được những khái niệm ban đầu về html, cách tạo file html cũng như những cú pháp cơ bản.

Ở bài học sau, chúng ta sẽ cùng tìm hiểu về CSS – CÁCH CHÈN CSS VÀO HTML và các cú pháp cơ bản của CSS

Cảm ơn bạn đã theo dõi bài viết. Hãy để lại bình luận hoặc góp ý của mình để phát triển bài viết tốt hơn. Đừng quyên “Luyện tập – Thử thách – Không ngại khó”.

Tải xuống

Tài liệu

Nhằm phục vụ mục đích học tập Offline của cộng đồng, Kteam hỗ trợ tính năng lưu trữ nội dung bài học Tổng quan về HTML và các cú pháp cơ bản dưới dạng file PDF trong link bên dưới.

Ngoài ra, bạn cũng có thể tìm thấy các tài liệu được đóng góp từ cộng đồng ở mục TÀI LIỆU trên thư viện Howkteam.com

Đừng quên like và share để ủng hộ Kteam và tác giả nhé!

Thảo luận

Nếu bạn có bất kỳ khó khăn hay thắc mắc gì về khóa học, đừng ngần ngại đặt câu hỏi trong phần bên dưới hoặc trong mục HỎI & ĐÁP trên thư viện Howkteam.com để nhận được sự hỗ trợ từ cộng đồng.