HTML là gì và tại sao chúng tôi sử dụng nó giải thích?

Đúng như tên gọi của nó, nó được sử dụng để thêm tiêu đề của trang HTML xuất hiện ở đầu cửa sổ trình duyệt. Nó phải được đặt bên trong thẻ đầu và phải đóng ngay lập tức. (Không bắt buộc)

. Văn bản giữa thẻ nội dung mô tả nội dung nội dung của trang hiển thị cho người dùng cuối. Thẻ này chứa nội dung chính của tài liệu HTML

. Văn bản giữa thẻ mô tả tiêu đề cấp đầu tiên của trang web

. văn bản giữa

thẻ mô tả đoạn văn của trang web


Tóm tắt lịch sử của HTML

Vào cuối những năm 1980, một nhà vật lý, Tim Berners-Lee, một nhà thầu tại CERN, đã đề xuất một hệ thống cho các nhà nghiên cứu của CERN. Năm 1989, ông đã viết một bản ghi nhớ đề xuất một hệ thống siêu văn bản dựa trên internet

Tim Berners-Lee được biết đến là cha đẻ của HTML. Mô tả đầu tiên về HTML là một tài liệu có tên "Thẻ HTML" do Tim đề xuất vào cuối năm 1991. Phiên bản mới nhất của HTML là HTML5, mà chúng ta sẽ tìm hiểu sau trong hướng dẫn này.


Phiên bản HTML

Kể từ thời điểm HTML được phát minh, có rất nhiều phiên bản HTML trên thị trường, phần giới thiệu ngắn gọn về phiên bản HTML được đưa ra dưới đây.

HTML 1. 0. Phiên bản đầu tiên của HTML là 1. 0, là phiên bản cơ bản của ngôn ngữ HTML và được phát hành vào năm 1991.

HTML 2. 0. Đây là phiên bản tiếp theo được phát hành vào năm 1995 và là phiên bản ngôn ngữ chuẩn cho thiết kế trang web. HTML2. 0 có thể hỗ trợ các tính năng bổ sung như tải lên tệp dựa trên biểu mẫu, các thành phần biểu mẫu như hộp văn bản, nút tùy chọn, v.v.

HTML 3. 2. HTML 3. 2 được W3C xuất bản vào đầu năm 1997. Phiên bản này có khả năng tạo bảng và cung cấp hỗ trợ cho các tùy chọn bổ sung cho các phần tử biểu mẫu. Nó cũng có thể hỗ trợ một trang web với các phương trình toán học phức tạp. Nó đã trở thành một tiêu chuẩn chính thức cho bất kỳ trình duyệt nào cho đến tháng 1 năm 1997. Ngày nay nó được hầu hết các trình duyệt hỗ trợ.

HTML 4. 01. HTML 4. 01 được phát hành vào tháng 12 năm 1999 và là phiên bản rất ổn định của ngôn ngữ HTML. Phiên bản này là tiêu chuẩn chính thức hiện tại và nó cung cấp hỗ trợ bổ sung cho biểu định kiểu (CSS) và khả năng tạo tập lệnh cho các yếu tố đa phương tiện khác nhau.

HTML5. HTML5 là phiên bản mới nhất của ngôn ngữ Đánh dấu siêu văn bản. Bản nháp đầu tiên của phiên bản này đã được công bố vào tháng 1 năm 2008. Có hai tổ chức lớn, một là W3C (World Wide Web Consortium) và một tổ chức khác là WHATWG (Nhóm làm việc về công nghệ ứng dụng siêu văn bản web) tham gia vào việc phát triển phiên bản HTML 5 và nó vẫn đang được phát triển.


Các tính năng của HTML

1) Đó là một ngôn ngữ rất dễ hiểu và đơn giản . Nó có thể dễ dàng hiểu và sửa đổi.

2) Rất dễ dàng để tạo một bản trình bày hiệu quả bằng HTML vì nó có rất nhiều thẻ định dạng.

3) Đó là một ngôn ngữ đánh dấu , vì vậy nó cung cấp một cách linh hoạt để thiết kế các trang web cùng với văn bản.

4) Nó tạo điều kiện cho người lập trình thêm liên kết trên các trang web (bằng thẻ neo html), vì vậy nó làm tăng sự thú vị khi duyệt web .

5) Nó độc lập với nền tảng vì nó có thể được hiển thị trên bất kỳ nền tảng nào như Windows, Linux và Macintosh, v.v.

6) Nó tạo điều kiện cho lập trình viên thêm Đồ họa, Video và Âm thanh vào các trang web giúp trang web hấp dẫn và tương tác hơn.

7) HTML là ngôn ngữ không phân biệt chữ hoa chữ thường, có nghĩa là chúng ta có thể sử dụng các thẻ ở dạng chữ thường hoặc chữ hoa

GHI CHÚ. Bạn nên viết tất cả các thẻ bằng chữ thường để có tính nhất quán, dễ đọc, v.v.

HTML, hay Ngôn ngữ đánh dấu siêu văn bản, là ngôn ngữ đánh dấu dành cho web xác định cấu trúc của các trang web

Đây là một trong những khối xây dựng cơ bản nhất của mọi trang web, vì vậy điều quan trọng là phải học nếu bạn muốn có một sự nghiệp trong lĩnh vực phát triển web

Trong bài viết này, tôi sẽ hướng dẫn bạn chi tiết HTML là gì, nó hoạt động như thế nào trên các trang web và chúng ta cũng sẽ đề cập đến một phần thực sự thú vị của HTML – HTML ngữ nghĩa

HTML là gì?

Để hiểu "HTML" từ trước ra sau, hãy xem xét từng từ tạo nên từ viết tắt

siêu văn bản. văn bản (thường có nhúng, chẳng hạn như hình ảnh) được tổ chức để kết nối các mục liên quan

đánh dấu. một hướng dẫn phong cách để sắp chữ bất cứ thứ gì được in ở định dạng bản cứng hoặc bản mềm

Ngôn ngữ. một ngôn ngữ mà một hệ thống máy tính hiểu và sử dụng để diễn giải các lệnh

HTML xác định cấu trúc của trang web. Chỉ riêng cấu trúc này là không đủ để làm cho một trang web trông đẹp mắt và tương tác. Vì vậy, bạn sẽ sử dụng các công nghệ được hỗ trợ như CSS và JavaScript để làm cho HTML của bạn trở nên đẹp mắt và thêm tính tương tác tương ứng

Trong trường hợp này, tôi muốn chia nhỏ ba công nghệ – HTML, CSS và JavaScript – theo cách này. chúng giống như một cơ thể con người

  • HTML là bộ xương,
  • CSS là da,
  • và JavaScript là hệ thống tuần hoàn, tiêu hóa và hô hấp mang lại sự sống cho cấu trúc và làn da

Bạn cũng có thể xem HTML, CSS và JavaScript theo cách này. HTML là cấu trúc của một ngôi nhà, CSS là trang trí nội thất và ngoại thất, và JavaScript là hệ thống điện, nước và nhiều tính năng chức năng khác giúp ngôi nhà có thể ở được

Thẻ HTML

Vì HTML xác định phần đánh dấu cho một trang web cụ thể nên bạn sẽ muốn văn bản, hình ảnh hoặc các nội dung nhúng khác xuất hiện theo những cách nhất định

Ví dụ: bạn có thể muốn một số văn bản có kích thước lớn, văn bản khác có kích thước nhỏ và một số văn bản được in đậm, in nghiêng hoặc ở dạng dấu đầu dòng

HTML có các "thẻ" cho phép bạn hoàn thành việc này. Vì vậy, có các thẻ để tạo tiêu đề, đoạn văn, từ in đậm, từ in nghiêng, v.v.

Hình ảnh bên dưới mô tả giải phẫu của thẻ HTML

HTML là gì và tại sao chúng tôi sử dụng nó giải thích?

Phần tử HTML

Một phần tử bao gồm thẻ mở, ký tự, nội dung và thẻ đóng. Một số phần tử trống – nghĩa là chúng không có thẻ đóng mà thay vào đó có nguồn hoặc liên kết tới nội dung mà bạn muốn nhúng vào trang web

Một ví dụ về phần tử trống là

HTML là gì và tại sao chúng tôi sử dụng nó giải thích?

Thuộc tính HTML

Các thẻ HTML cũng lấy những gì được gọi là thuộc tính. Các thuộc tính này được đặt trong thẻ mở và bao gồm từ kiểu và id cho đến các lớp. Chúng nhận các giá trị, truyền tải thêm thông tin về phần tử và giúp bạn thực hiện những việc như tạo kiểu và thao tác với JavaScript

Trong đồ họa thông tin bên dưới, thẻ mở chứa thuộc tính class với giá trị là “text”. Điều này có thể được sử dụng để tạo kiểu cho phần tử hoặc chọn phần tử đó bằng JavaScript để tương tác

HTML là gì và tại sao chúng tôi sử dụng nó giải thích?

Đây là giải phẫu của một trang HTML cơ bản



  
    
    
    
    Definition of HTML
  
  
    
  

Hãy xem xét các đoạn mã quan trọng ở đây

. Chỉ định rằng chúng tôi đang sử dụng HTML5 trong mã này. Trước khi giới thiệu HTML5, bạn phải nêu rõ ràng phiên bản HTML mà bạn đang mã hóa bằng thẻ . Ví dụ: HTML4. 0, 3. 2, v.v. Nhưng bây giờ chúng ta không còn cần nó nữa. Khi “html” được viết trong mã, trình duyệt sẽ tự động cho rằng bạn đang viết mã trong HTML5

. phần tử gốc hoặc cấp cao nhất của mọi tài liệu HTML. Mọi yếu tố khác phải được bao bọc trong đó

. một trong những phần quan trọng nhất của tài liệu HTML. Trình thu thập dữ liệu web nhìn vào bên trong các thẻ đầu để lấy thông tin quan trọng về trang. Nó chứa thông tin như tiêu đề trang, biểu định kiểu, thông tin meta cho SEO, v.v.

. đây là một phần tử trống truyền tải siêu thông tin về trang. Những thông tin như vậy có thể bao gồm tác giả, loại mã hóa nó đang sử dụng (hầu như luôn luôn là UTF-8), khả năng đáp ứng, khả năng tương thích, v.v. Trình thu thập dữ liệu web luôn nhìn vào thẻ meta để lấy thông tin về trang web, điều này sẽ đóng một vai trò quan trọng trong SEO



  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
0. điều này xác định tiêu đề của trang web. Nó luôn được hiển thị trong tab trình duyệt



  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
1. tất cả nội dung của tài liệu HTML nằm bên trong thẻ body. Chỉ có thể có một thẻ


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
2 trên toàn bộ trang

HTML ngữ nghĩa là gì?

Semantic HTML có nghĩa là các thẻ HTML của bạn truyền đạt ý nghĩa thực sự của những gì chúng được sử dụng cho

Ngữ nghĩa là một phần không thể thiếu của HTML kể từ khi ra đời vào đầu những năm 90. Nhưng nó chưa bao giờ đạt được mức độ phù hợp đặc biệt cho đến cuối những năm 90 khi CSS bắt đầu hoạt động trên hầu hết các trình duyệt

Với HTML ngữ nghĩa, các thẻ trung lập về ngữ nghĩa như



  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
3 và


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
4 không được tán thành vì các thẻ mô tả ngữ nghĩa hơn như


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
5,


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
6,


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
7,


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
8,


  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
9 và
HTML là gì và tại sao chúng tôi sử dụng nó giải thích?

Bạn có thể thấy rằng nội dung bên trong thẻ class3 không có trong thanh bên và nội dung bên trong thẻ



  
    
    
    
    Definition of HTML
  

  
    

LOGO

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Optio magni est asperiores nemo, adipisci minus itaque quam, rem libero aliquam nesciunt, nisi inventore assumenda earum repellat labore ratione architecto eos quis. Soluta mollitia cupiditate dolorem. Consequatur a soluta laudantium nihil. Molestias, officiis ut! Nobis adipisci voluptatem quam at officia beatae!
You can find me on Twitter You can find me on Instagram
© 2020 All Rights Reserved
6 không tự động có sẵn dưới dạng thanh điều hướng. Đây là lý do tại sao bạn vẫn phải làm cho chúng trông giống như cách chúng phải trông bằng CSS

Phần kết luận

Tôi hy vọng bài viết này đã giúp bạn tìm hiểu những kiến ​​thức cơ bản về HTML và chức năng của nó. Giờ đây, bạn có thể bắt đầu tìm hiểu các công nghệ tiên tiến hơn như CSS và JavaScript, sau đó bắt đầu hình thành sự nghiệp vững chắc trong lĩnh vực phát triển web

Cảm ơn rất nhiều vì đã đọc và có một thời gian tốt đẹp

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO

QUẢNG CÁO


HTML là gì và tại sao chúng tôi sử dụng nó giải thích?
Kolade Chris

Nhà phát triển web và nhà văn kỹ thuật tập trung vào các công nghệ giao diện người dùng


Nếu bạn đọc đến đây, hãy tweet cho tác giả để cho họ thấy bạn quan tâm. Tweet một lời cảm ơn

Học cách viết mã miễn phí. Chương trình giảng dạy mã nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu