Tài liệu HTML bao gồm một khai báo loại tài liệu và phần tử gốc <html>. Đầu tài liệu và nội dung tài liệu được lồng trong phần tử <html>.
Mặc dù phần đầu của tài liệu không xuất hiện bên ngoài mã, nhưng phần này rất quan trọng để một trang web hoạt động. Tệp này chứa tất cả siêu thông tin, bao gồm cả thông tin về kết quả trên công cụ tìm kiếm và mạng xã hội, biểu tượng cho thẻ trình duyệt và lối tắt trên màn hình chính của thiết bị di động, cũng như hành vi và cách trình bày nội dung của bạn. Trong phần này, bạn sẽ khám phá những thành phần không hiển thị nhưng có trên hầu hết mọi trang web.
Để tạo trang web MachineLearningWorkshop.com (MLW), hãy bắt đầu bằng cách thêm các thành phần cần thiết cho mọi trang web: loại tài liệu, ngôn ngữ tự nhiên của nội dung, bộ ký tự và tất nhiên là tiêu đề hoặc tên của trang web hoặc ứng dụng.
Thêm vào mọi tài liệu HTML
Có một số phần tử cần thiết cho mọi trang web. Trình duyệt sẽ hiển thị nội dung nếu thiếu các phần tử này, nhưng bạn nên thêm chúng.
<!DOCTYPE html>
Điều đầu tiên trong mọi tài liệu HTML là phần mở đầu. Đối với HTML, bạn chỉ cần <!DOCTYPE html>. Đây trông giống như một phần tử HTML, nhưng thực ra đây là một nút đặc biệt có tên là doctype. Loại tài liệu này cho trình duyệt biết rằng bạn muốn sử dụng chế độ tiêu chuẩn.
Khi bị bỏ qua, các trình duyệt sẽ sử dụng một chế độ kết xuất khác, được gọi là chế độ tương thích ngược.
Việc thêm loại tài liệu giúp ngăn chặn chế độ tương thích ngược.
<html>
Phần tử <html> là phần tử gốc của một tài liệu HTML. Đây là phần tử mẹ của <head> và <body>, chứa mọi thứ trong tài liệu HTML, ngoại trừ loại tài liệu. Nếu bỏ qua, ngôn ngữ sẽ được ngầm hiểu, nhưng bạn nên thêm ngôn ngữ này để khai báo ngôn ngữ của tài liệu.
Ngôn ngữ nội dung
Thuộc tính lang trong thẻ <html> xác định ngôn ngữ chính của tài liệu. Giá trị này là mã ngôn ngữ ISO, theo sau là một khu vực không bắt buộc.
Ví dụ: tiếng Pháp ở Canada là fr-CA, còn ở Burkina Faso là fr-BF. Khai báo này giúp trình đọc màn hình, công cụ tìm kiếm và dịch vụ dịch xác định ngôn ngữ của tài liệu.
Bạn có thể sử dụng thuộc tính lang trên các thẻ khác để xác định trường hợp ngoại lệ đối với ngôn ngữ chính của tài liệu. Giống như cách sử dụng trong phần đầu, thuộc tính lang trong phần nội dung không có hiệu ứng trực quan. Thẻ này thêm ngữ nghĩa, nhờ đó các công nghệ hỗ trợ và dịch vụ tự động có thể xác định ngôn ngữ của nội dung cụ thể.
Ngoài việc đặt ngôn ngữ cho tài liệu và các trường hợp ngoại lệ đối với ngôn ngữ cơ bản đó, bạn có thể sử dụng thuộc tính này trong bộ chọn CSS.
Bạn có thể nhắm đến <span lang="fr-fr">Ceci n'est pas une pipe.</span> bằng thuộc tính và bộ chọn ngôn ngữ [lang|="fr"] và :lang(fr).
<head>
Nằm giữa thẻ mở và thẻ đóng <html>, chúng ta tìm thấy 2 thẻ con: <head> và <body>:
<!DOCTYPE html>
<html lang="en-US">
<head>
</head>
<body>
</body>
</html>
<head> chứa siêu dữ liệu cho một trang web hoặc ứng dụng, trong khi <body> chứa nội dung hiển thị. Phần còn lại của phần này tập trung vào các thành phần được lồng bên trong phần tử <head>.
Các thành phần bắt buộc trong <head>
Siêu dữ liệu của tài liệu, bao gồm tiêu đề tài liệu, bộ ký tự, chế độ cài đặt khung hiển thị, nội dung mô tả, URL cơ sở, đường liên kết đến biểu định kiểu và biểu tượng, đều nằm trong phần tử <head>. Mặc dù có thể không cần tất cả các tính năng này, nhưng bạn luôn phải thêm bộ ký tự, tiêu đề và chế độ cài đặt khung hiển thị.
Mã hoá ký tự
Phần tử đầu tiên trong <head> phải là khai báo mã hoá ký tự charset. Phần tử này xuất hiện trước tiêu đề để đảm bảo trình duyệt có thể hiển thị các ký tự trong tiêu đề đó và tất cả các ký tự trong phần còn lại của tài liệu.
Phương thức mã hoá mặc định trong hầu hết các trình duyệt là windows-1252, tuỳ thuộc vào ngôn ngữ. Tuy nhiên, bạn nên sử dụng UTF-8, cho phép mã hoá từ 1 đến 4 byte của tất cả các ký tự.
Để đặt chế độ mã hoá ký tự thành UTF-8, hãy thêm:
<meta charset="utf-8" />
Bằng cách khai báo UTF-8 (không phân biệt chữ hoa chữ thường), bạn thậm chí có thể thêm biểu tượng cảm xúc vào tiêu đề.
Mọi thứ trong tài liệu đều kế thừa chế độ mã hoá ký tự, ngay cả <style> và <script>. Tuyên bố nhỏ này có nghĩa là bạn có thể thêm biểu tượng cảm xúc vào tên lớp và selectorAPI. Nếu bạn sử dụng biểu tượng cảm xúc, hãy nhớ sử dụng theo cách giúp nâng cao khả năng sử dụng mà không làm ảnh hưởng đến khả năng tiếp cận.
Tên tài liệu
Mỗi trang (trang chủ và tất cả các trang bổ sung) đều phải có một tiêu đề riêng. Nội dung của tiêu đề tài liệu (văn bản giữa thẻ mở và thẻ đóng <title>) sẽ xuất hiện trong thẻ trình duyệt, danh sách các cửa sổ đang mở, nhật ký, kết quả tìm kiếm và trong thẻ trên mạng xã hội (trừ phi được xác định lại bằng thẻ <meta>).
<title>Machine Learning Workshop</title>
Siêu dữ liệu khung nhìn
Thẻ meta khung nhìn là yếu tố cần thiết để đảm bảo khả năng thích ứng của trang web, giúp nội dung hiển thị tốt bất kể chiều rộng khung nhìn. Mặc dù thẻ meta khung nhìn đã xuất hiện từ năm 2007, nhưng gần đây thẻ này mới được ghi lại trong một quy cách. Thẻ này kiểm soát kích thước và tỷ lệ khung nhìn, ngăn nội dung bị thu nhỏ để vừa với màn hình nhỏ hơn.
<meta name="viewport" content="width=device-width" />
Đoạn mã trên có nghĩa là "tạo trang web thích ứng, bắt đầu bằng cách đặt chiều rộng của nội dung bằng chiều rộng của màn hình". Ngoài width, bạn có thể đặt mức thu phóng và khả năng mở rộng, nhưng cả hai đều mặc định là các giá trị có thể truy cập. Nếu muốn chỉ định rõ ràng, hãy thêm:
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1" />
Khung nhìn là một phần của quy trình kiểm tra khả năng tiếp cận của Lighthouse. Trang web của bạn sẽ vượt qua quy trình này nếu có khả năng mở rộng và không đặt kích thước tối đa.
Cho đến nay, cấu trúc của tệp HTML là:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Machine Learning Workshop</title>
<meta name="viewport" content="width=device-width" />
</head>
<body>
</body>
</html>
Nội dung khác trên <head>
<head> còn có nhiều tính năng khác. Trên thực tế, tất cả siêu dữ liệu.
Mặc dù hầu hết các phần tử mà bạn sẽ thấy trong <head> đều được đề cập trong khoá học này, nhưng chúng tôi sẽ chia sẻ thêm trong Khoá học về siêu dữ liệu.
Bạn đã thấy bộ ký tự meta và tiêu đề tài liệu, nhưng có nhiều siêu dữ liệu khác ngoài thẻ <meta> mà bạn nên thêm vào.
CSS
<head> là nơi bạn đưa các kiểu vào HTML. Có một lộ trình học tập dành riêng cho CSS nếu bạn muốn tìm hiểu về các kiểu, nhưng bạn cần biết cách đưa các kiểu đó vào tài liệu HTML.
Có 3 cách để thêm CSS: <link>, <style> và thuộc tính style.
Hai cách chính để đưa kiểu vào tệp HTML là đưa tài nguyên bên ngoài bằng cách sử dụng phần tử <link> có thuộc tính rel được đặt thành stylesheet hoặc đưa CSS trực tiếp vào đầu tài liệu trong thẻ <style> mở và đóng.
Thẻ <link> là phương thức ưu tiên để đưa biểu định kiểu vào. Việc liên kết một hoặc một vài biểu định kiểu bên ngoài sẽ mang lại trải nghiệm tốt cho nhà phát triển và hiệu suất tốt cho trang web: bạn có thể duy trì CSS ở một vị trí thay vì rải rác ở mọi nơi và trình duyệt có thể lưu tệp bên ngoài vào bộ nhớ đệm, tức là tệp đó không cần phải tải xuống lại mỗi khi điều hướng trang.
Cú pháp là <link rel="stylesheet" href="styles.css">, trong đó styles.css là tên tệp và vị trí tương đối cho biểu định kiểu. Bạn có thể thấy thuộc tính type="text/css" nhưng không bắt buộc. Thuộc tính rel xác định mối quan hệ, trong trường hợp này là stylesheet. Nếu bạn bỏ qua thuộc tính rel, CSS của bạn sẽ không được liên kết.
Bạn sẽ khám phá một số giá trị rel khác trong thời gian ngắn, nhưng trước tiên, bạn sẽ tìm hiểu những cách khác để đưa CSS vào.
Nếu muốn các kiểu biểu định kiểu bên ngoài nằm trong một lớp xếp tầng nhưng bạn không có quyền chỉnh sửa tệp CSS, thì bạn nên thêm CSS bằng @import bên trong <style>:
<style>
@import "styles.css" layer(firstLayer);
</style>
Khi sử dụng @import để nhập biểu định kiểu vào tài liệu của bạn (không bắt buộc) vào các lớp xếp tầng, các câu lệnh @import phải là câu lệnh đầu tiên trong <style> hoặc biểu định kiểu được liên kết, bên ngoài khai báo bộ ký tự.
Mặc dù các lớp xếp tầng vẫn còn khá mới và bạn có thể không thấy @import trong <style> đầu, nhưng bạn sẽ thường thấy các thuộc tính tuỳ chỉnh được khai báo trong một khối kiểu đầu:
<style>
:root {
--theme-color: #226DAA;
}
</style>
Kiểu, được thêm bằng <link>, <style> hoặc cả hai, phải nằm trong phần đầu. Mặc dù các kiểu này hoạt động khi được đưa vào nội dung của tài liệu, nhưng bạn nên thêm kiểu vào phần đầu vì lý do hiệu suất. Điều này có vẻ không hợp lý, vì bạn có thể nghĩ rằng bạn muốn nội dung của mình tải trước. Tuy nhiên, tốt hơn là trình duyệt nên biết cách hiển thị nội dung khi nội dung được tải. Việc thêm kiểu trước tiên sẽ ngăn chặn việc vẽ lại không cần thiết xảy ra nếu một phần tử được tạo kiểu sau khi được hiển thị lần đầu.
Có một cách để đưa các kiểu mà bạn sẽ không bao giờ sử dụng vào <head> của tài liệu: kiểu nội tuyến. Có lẽ bạn sẽ không bao giờ sử dụng các kiểu nội tuyến trong phần đầu vì biểu định kiểu của tác nhân người dùng sẽ ẩn phần đầu theo mặc định. Nhưng nếu muốn tạo một trình chỉnh sửa CSS mà không cần JavaScript (ví dụ: để có thể kiểm thử các phần tử tuỳ chỉnh của trang), bạn có thể hiển thị phần đầu bằng display: block, sau đó ẩn mọi thứ trong phần đầu, rồi dùng thuộc tính style nội tuyến để hiển thị khối kiểu có thể chỉnh sửa nội dung.
<style contenteditable style="display: block; font-family: monospace; white-space: pre;">
head { display: block; }
head * { display: none; }
:root {
--theme-color: #226DAA;
}
</style>
Bạn có thể thêm kiểu nội tuyến vào phần tử <style>.
Các trường hợp sử dụng khác của phần tử <link>
Phần tử link được dùng để tạo mối quan hệ giữa tài liệu HTML và các tài nguyên bên ngoài. Một số tài nguyên trong số này có thể tải xuống, còn một số khác chỉ mang tính chất cung cấp thông tin. Loại mối quan hệ được xác định bằng giá trị của thuộc tính rel. Có 25 giá trị có sẵn cho thuộc tính rel mà bạn có thể sử dụng với <link>, <a> và <area> hoặc <form>, trong đó có một số giá trị có thể sử dụng với tất cả. Bạn nên đưa những thông tin liên quan đến siêu dữ liệu vào phần đầu và những thông tin liên quan đến hiệu suất vào <body>.
Giờ đây, bạn sẽ thêm 3 loại khác vào tiêu đề: icon, alternate và canonical. Bạn sẽ thêm kiểu thứ tư là rel="manifest" trong mô-đun tiếp theo.
Biểu tượng trang web
Sử dụng thẻ <link> với rel="icon" để xác định biểu tượng trang web cho tài liệu của bạn. Favicon là một biểu tượng nhỏ xuất hiện trên thẻ trình duyệt, thường ở bên trái tiêu đề tài liệu. Khi các thẻ thu nhỏ, tiêu đề có thể biến mất nhưng biểu tượng vẫn hiển thị. Hầu hết các biểu tượng trang web đều là biểu trưng của công ty hoặc ứng dụng.
Nếu bạn không khai báo biểu tượng trang web, trình duyệt sẽ tìm một tệp có tên favicon.ico trong thư mục cấp cao nhất (thư mục gốc của trang web). Với <link>, bạn có thể sử dụng tên tệp và vị trí khác:
<link rel="icon" sizes="16x16 32x32 48x48" type="image/png" href="/images/mlwicon.png" />
Đoạn mã trên cho biết "sử dụng mlwicon.png làm biểu tượng cho những trường hợp mà 16px, 32px hoặc 48px có ý nghĩa". Thuộc tính sizes chấp nhận giá trị any cho các biểu tượng có thể mở rộng hoặc danh sách các giá trị hình vuông widthXheight được phân tách bằng dấu cách; trong đó, các giá trị chiều rộng và chiều cao là 16, 32, 48 hoặc lớn hơn trong chuỗi hình học đó, đơn vị pixel bị bỏ qua và X không phân biệt chữ hoa chữ thường.
<link rel="apple-touch-icon" sizes="180x180" href="/images/mlwicon.png" />
<link rel="mask-icon" href="/images/mlwicon.svg" color="#226DAA" />
Có 2 loại biểu tượng đặc biệt không theo tiêu chuẩn cho trình duyệt Safari: apple-touch-icon cho thiết bị iOS và mask-icon cho các thẻ được ghim trên macOS.
apple-touch-icon chỉ được áp dụng khi người dùng thêm một trang web vào màn hình chính: bạn có thể chỉ định nhiều biểu tượng có sizes khác nhau cho các thiết bị khác nhau.
mask-icon sẽ chỉ được dùng nếu người dùng ghim thẻ trong Safari trên máy tính: bản thân biểu tượng phải là một SVG đơn sắc và thuộc tính color sẽ điền màu cần thiết vào biểu tượng.
Mặc dù bạn có thể sử dụng <link> để xác định một hình ảnh hoàn toàn khác trên mỗi trang hoặc thậm chí mỗi lần tải trang, nhưng đừng làm vậy. Để đảm bảo tính nhất quán và mang lại trải nghiệm tốt cho người dùng, hãy sử dụng một hình ảnh duy nhất. Google sử dụng các biểu tượng trang web khác nhau cho từng ứng dụng của mình: ví dụ: biểu tượng thư, biểu tượng lịch. Nhưng tất cả biểu tượng của Google đều sử dụng cùng một bảng phối màu. Bạn biết chính xác nội dung của một thẻ đang mở thông qua biểu tượng.
Các phiên bản thay thế của trang web
Sử dụng giá trị alternate của thuộc tính rel để xác định bản dịch hoặc các cách trình bày thay thế của trang web.
Giả sử chúng ta có các phiên bản của trang web được dịch sang tiếng Pháp và tiếng Bồ Đào Nha (Brazil):
<link rel="alternate" href="https://www.machinelearningworkshop.com/fr/" hreflang="fr-FR" />
<link rel="alternate" href="https://www.machinelearningworkshop.com/pt/" hreflang="pt-BR" />
Khi sử dụng alternate cho bản dịch, bạn phải đặt thuộc tính hreflang.
Giá trị thay thế không chỉ dùng để dịch. Ví dụ: thuộc tính type có thể xác định URI thay thế cho nguồn cấp dữ liệu RSS khi thuộc tính type được đặt thành application/rss+xml hoặc application/atom+xml.
Đường liên kết đến một phiên bản PDF giả mạo của trang web:
<link rel="alternate" type="application/x-pdf" href="https://machinelearningworkshop.com/mlw.pdf" />
Nếu giá trị rel là alternate stylesheet, thì giá trị này sẽ xác định một biểu định kiểu thay thế và bạn phải đặt thuộc tính title để đặt tên cho kiểu thay thế đó.
Chuẩn
Nếu bạn tạo nhiều bản dịch hoặc phiên bản của Hội thảo về học máy, thì các công cụ tìm kiếm có thể không xác định được nguồn đáng tin cậy. Sử dụng rel="canonical" để xác định URL ưu tiên cho trang web hoặc ứng dụng.
Thêm URL chính tắc vào tất cả các trang được dịch và trang chủ, cho biết URL mà chúng tôi ưu tiên:
<link rel="canonical" href="https://www.machinelearning.com" />
Đường liên kết chính tắc rel="canonical" thường được dùng để đăng chéo với các nền tảng xuất bản và blog nhằm ghi công cho nguồn ban đầu. Khi phân phối nội dung, trang web phải có đường liên kết chính tắc đến nguồn ban đầu.
Tập lệnh
Thẻ <script> bao gồm các tập lệnh. Loại mặc định là JavaScript. Nếu bạn sử dụng một ngôn ngữ kịch bản khác, hãy thêm thuộc tính type có loại MIME hoặc type="module" cho mô-đun JavaScript.
Chỉ các mô-đun JavaScript và JavaScript được phân tích cú pháp và thực thi.
Bạn có thể dùng thẻ <script> để đóng gói mã hoặc tải một tệp bên ngoài xuống. Trong MLW, không có tệp tập lệnh bên ngoài vì trái với suy nghĩ của nhiều người, bạn không cần JavaScript cho một trang web hoạt động. Đây là lộ trình học tập HTML, không phải lộ trình học tập JavaScript.
Sau này, bạn sẽ thêm một đoạn mã JavaScript nhỏ để tạo trứng phục sinh:
<script>
document.getElementById('switch').addEventListener('click', function() {
document.body.classList.toggle('black');
});
</script>
Đoạn mã này tạo một trình xử lý sự kiện cho một phần tử có mã nhận dạng là switch.
Với JavaScript, bạn nên tránh tham chiếu đến một phần tử trước khi phần tử đó tồn tại. Vì switch chưa tồn tại, nên chúng ta sẽ chưa thêm trình xử lý sự kiện.
Khi thêm phần tử công tắc đèn, chúng ta sẽ thêm <script> ở cuối <body> thay vì trong <head>. Tại sao? Có 2 lý do. Chúng ta muốn đảm bảo các phần tử tồn tại trước khi tập lệnh tham chiếu đến chúng được gặp phải vì chúng ta không dựa tập lệnh này trên một sự kiện DOMContentLoaded.
Và chủ yếu là JavaScript không chỉ chặn quá trình hiển thị mà trình duyệt còn dừng tải xuống tất cả các thành phần khi tải xuống tập lệnh và không tiếp tục tải xuống các thành phần khác cho đến khi JavaScript hoàn tất quá trình thực thi. Vì lý do này, bạn thường thấy các yêu cầu JavaScript ở cuối tài liệu thay vì ở phần đầu.
Có hai thuộc tính có thể giảm tính chất chặn của quá trình tải xuống và thực thi JavaScript: defer và async. Với defer, quá trình kết xuất HTML sẽ không bị chặn trong quá trình tải xuống và JavaScript chỉ thực thi sau khi tài liệu hoàn tất quá trình kết xuất. Với async, quá trình kết xuất cũng không bị chặn trong quá trình tải xuống, nhưng sau khi tập lệnh hoàn tất quá trình tải xuống, quá trình kết xuất sẽ tạm dừng trong khi JavaScript được thực thi.
Để đưa JavaScript của MLW vào một tệp bên ngoài, bạn có thể viết:
<script src="js/switch.js" defer></script>
Việc thêm thuộc tính defer sẽ trì hoãn việc thực thi tập lệnh cho đến khi mọi thứ được kết xuất, ngăn tập lệnh làm ảnh hưởng đến hiệu suất. Thuộc tính async và defer chỉ hợp lệ trên các tập lệnh bên ngoài.
Cơ sở
Có một phần tử khác chỉ có trong <head>.. Phần tử <base> ít dùng cho phép đặt URL và đích đến của đường liên kết mặc định. Thuộc tính href xác định URL cơ sở cho tất cả các đường liên kết tương đối.
Thuộc tính target (hợp lệ trên <base> cũng như trên các đường liên kết và biểu mẫu) đặt vị trí mà các đường liên kết đó sẽ mở. Giá trị mặc định của _self sẽ mở các tệp được liên kết trong cùng một ngữ cảnh với tài liệu hiện tại. Các lựa chọn khác bao gồm _blank (mở mọi đường liên kết trong một cửa sổ mới), _parent của nội dung hiện tại (có thể giống với chính nó nếu trình mở không phải là iframe) hoặc _top (nằm trong cùng một thẻ trình duyệt, nhưng bật ra khỏi mọi ngữ cảnh để chiếm toàn bộ thẻ).
Hầu hết nhà phát triển đều thêm thuộc tính target vào một số ít đường liên kết (nếu có) mà họ muốn mở trong một cửa sổ mới trên chính các đường liên kết hoặc biểu mẫu, thay vì sử dụng <base>.
<base target="_top" href="https://machinelearningworkshop.com" />
Nếu trang web của chúng tôi nằm trong một iframe trên một trang web như Yummly, thì việc thêm phần tử <base> có nghĩa là khi người dùng nhấp vào bất kỳ đường liên kết nào trong tài liệu của chúng tôi, đường liên kết đó sẽ tải ra khỏi iframe, chiếm toàn bộ cửa sổ trình duyệt.
Một trong những nhược điểm của phần tử này là các đường liên kết trong phần tử neo được phân giải bằng <base>. <base> chuyển đổi hiệu quả đường liên kết <a href="#ref"> thành <a target="_top" href="https://machinelearningworkshop.com#ref">, kích hoạt một yêu cầu HTTP đến URL cơ sở có đoạn được đính kèm.
Một số điều khác về <base>:
- Chỉ có thể có một phần tử
<base>trong một tài liệu. - Bạn nên đặt thẻ này trước khi sử dụng bất kỳ URL tương đối nào, kể cả các tham chiếu có thể có đến tập lệnh hoặc biểu định kiểu.
Bây giờ, mã sẽ có dạng như sau:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Machine Learning Workshop</title>
<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="css/styles.css" />
<link rel="icon" type="image/png" href="/images/favicon.png" />
<link rel="alternate" href="https://www.machinelearningworkshop.com/fr/" hreflang="fr-FR" />
<link rel="alternate" href="https://www.machinelearningworkshop.com/pt/" hreflang="pt-BR" />
<link rel="canonical" href="https://www.machinelearning.com" />
</head>
<body>
<!-- <script defer src="scripts/lightswitch.js"></script>-->
</body>
</html>
Chú thích HTML
Tập lệnh được đặt trong dấu ngoặc nhọn, dấu gạch ngang và dấu chấm than. Đây là cách bạn nhận xét HTML. Mọi nội dung giữa <!-- và --> đều không xuất hiện hoặc được phân tích cú pháp. Bạn có thể đặt nhận xét HTML ở bất kỳ vị trí nào trên trang, ngoại trừ trong tập lệnh hoặc khối kiểu. Trong trường hợp này, bạn nên sử dụng nhận xét JavaScript và CSS.
Bạn đã nắm được những kiến thức cơ bản về nội dung trong <head>, nhưng bạn muốn tìm hiểu nhiều hơn những kiến thức cơ bản. Trong các phần tiếp theo, chúng ta sẽ tìm hiểu về thẻ meta và cách kiểm soát nội dung hiển thị khi trang web của bạn được liên kết trên mạng xã hội.
Kiểm tra kiến thức của bạn
Kiểm tra kiến thức của bạn về cấu trúc tài liệu.
Làm cách nào để xác định ngôn ngữ của tài liệu?
language vào thẻ HTML.lang vào thẻ HTML.Add the <lang> thành <head>.Chọn những phần tử có thể được đưa vào <head>.
<p><title><meta>