path: root/files/vi/web/html_vi/index.html

---
title: HTML
slug: Web/HTML_vi
translation_of: Web/HTML
---
<div>{{HTMLSidebar}}</div>

<p class="summary"><span class="seoSummary"><strong>HTML</strong> (Viết tắt của cụm từ: HyperText Markup Language - Ngôn ngữ đánh dấu siêu văn bản) được xem như là khung xương của một trang web. Mọi việc "mô tả", "định nghĩa" bố cục, <em>nội dung</em> trang web đều do HTML thực hiện. Bên cạnh đó là sự xuất hiện của việc trang trí/trình bày do <a href="/en-US/docs/Web/CSS">CSS</a> đảm nhiệm và các chức năng/hành động của <a href="/en-US/docs/Web/JavaScript">JavaScript</a>.</span></p>

<p>"HyperText" (Siêu văn bản) biểu diễn sự liên kết các trang web với nhau, trên một trang web sẽ có thể sẽ chứa nhiều trang khác nhau và mỗi trang như thế lại được quy ra là một tệp HTML. Liên kết là một khái niệm cơ bản của Web.</p>

<p>Bằng cách tải nội dung lên mạng, liên kết nó với các trang do người khác tạo ra, và bạn đã trở thành một thành viên "tích cực" của World Wide Web. Tada!!!</p>

<p>HTML sử dụng "markup" (chú thích) để chú thích văn bản, hình ảnh và những nội dung khác để hiển thị trên trình duyệt web. HTML markup chứa các "elements" (phần tử) đặc biệt như {{HTMLElement("head")}}, {{HTMLElement("title")}}, {{HTMLElement("body")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("p")}}, {{HTMLElement("div")}}, {{HTMLElement("span")}}, {{HTMLElement("img")}}, và (n + 1) thứ khác nữa.</p>

<p>Tags (các thẻ) trong HTML chả phân biệt chữ hoa hay thường đâu. Bạn thích viết kiểu gì cũng được. Ví dụ nhé: thẻ <strong>&lt;title&gt; </strong>có thể viết thành &lt;Title&gt;,&lt;TiTlE&gt; hay &lt;tItLe&gt; và rất rất nhiều cách khác. Đương nhiên là đủ và đúng chữ cái, chứ không phải t33nc0d3 đâu nha.</p>

<p>Những bài viết dưới đây sẽ giúp đạo hữu hiểu rõ hơn về HTML.</p>

<section class="cleared" id="sect1">
<ul class="card-grid">
 <li><span>Khai thông HTML</span>

  <p>Nếu đạo hữu là người mới vào ngành lập trình web, hãy chắc rằng đã đọc qua bài <a href="/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics">HTML Khai Quyển</a> để hiểu HTML là gì và dùng như nào.</p>
 </li>
 <li><span>HTML Hướng dẫn</span>
  <p>Những bài viết về cách sử dụng HTML, có hướng dẫn và đầy đủ ví dụ, mời đạo hữu xem qua <a href="/en-US/docs/Learn/HTML">HTML Học Vực</a>.</p>
 </li>
 <li><span>HTML Kỳ thư</span>
  <p>Trong phần <a href="/en-US/docs/Web/HTML/Reference">Tham khảo HTML  mở rộng</a>, đạo hữu sẽ trên thông thiên văn, dưới tường địa lý, hiểu rõ tất tần tật về phần tử và thuộc tính trong HTML.</p>
 </li>
</ul>

<div class="row topicpage-table">
<div class="section">
<h2 class="Tools" id="Nhập_môn_quyển">Nhập môn quyển</h2>

<p><a href="/en-US/docs/Learn/HTML">HTML Học Vực</a> của bần đạo có những mô-đun HTML chạy ngay từ đầu — đạo hữu không cần kiến thức trước đó vẫn sẽ được khai thông.</p>

<dl>
 <dt><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Khai quyển HTML</a></dt>
 <dd>Khai quyển sẽ thiết lập những kiến thức nền tảng cho đạo hữu, giúp đạo hữu hiểu các khái niệm và sử dụng các cú pháp quan trọng. Như việc cho HTML vào văn bản, làm sao để tạo liên kết, cách sử dụng HTML để xây dựng một trang web.</dd>
 <dt><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding">Nhúng và Đa phương tiện</a></dt>
 <dd>Phần này sẽ khai mở kiến thức sử dụng HTML để nhét đa phương tiện vào website của đạo hữu, kể cả 1 vạn phương pháp nhét ảnh vào website, và làm sao để nhúng video, âm thanh và kể cả website của người khác.</dd>
 <dt><a href="/en-US/docs/Learn/HTML/Tables">Bảng trong HTML</a></dt>
 <dd>Việc trình bày bảng trên một website theo một cách dễ hiểu và dễ tiếp cận có thể là thiên kiếp đối với nhiều người tu hành HTML Kỳ kinh. Phần này có phương pháp từ cơ bản đến phức tạp hơn, chẳng hạn như phụ đề và tóm tắt.</dd>
 <dt><a href="/en-US/docs/Learn/HTML/Forms">Biểu mẫu HTML</a></dt>
 <dd>Biểu mẫu là thần hồn của website — nó cung cấp cho đạo hữu một thiên hà chức năng mà đạo hữu cần để tương tác với trang web. Ví dụ như Ký danh - Đăng nhập, gửi phản hồi, báo quan, mua bán dao dịch sản phẩm, và nhiều hơn thế nữa. Phần này sẽ chỉ dẫn đạo hữu tạo ra biểu mẫu từ client-side (tạm dịch: phía máy khách) / front-end (tạm dịch: phần giao diện).</dd>
 <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto">Dùng HTML để giải quyết vấn đề thường gặp</a></dt>
 <dd>Cung cấp liên kết tới các nội dung để giải thích làm sao để sử dụng HTML để giải quyết vấn đề thường mắc phải khi tạo lập một trang web: liên quan tới các tiêu đề, chèn hình ảnh hoặc video, nhấn mạnh nội dung, tạo lập biểu mẫu cơ bản, vân vân.</dd>
</dl>

<h2 id="Cao_cấp_chủ_đề">Cao cấp chủ đề</h2>

<dl>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/CORS_enabled_image">CORS để kích hoạt hình ảnh</a></dt>
 <dd class="landingPageList">Thuộc tính <code><a href="/en-US/docs/Web/HTML/Element/img#attr-crossorigin">crossorigin</a></code>, kết hợp với <a class="glossaryLink" href="/en-US/docs/Glossary/CORS">một CORS</a>, cho phép hình ảnh được định nghĩa vởi phần tử {{HTMLElement("img")}} để có thể nạp từ bên ngoài và sử dụng bên trong phần tử {{HTMLElement("canvas")}} như thể nó đang được nạp từ nơi này.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">Cài đặt thuộc tính CORS</a></dt>
 <dd class="landingPageList">Một số phần tử HTML cung cấp sự hỗ trợ cho <a href="/en-US/docs/HTTP/Access_control_CORS">CORS</a>, ví dụ như {{HTMLElement("img")}} hay {{HTMLElement("video")}}, có một thuộc tính <code>crossorigin</code> (đặc tính <code>crossOrigin</code>),<span id="result_box" lang="vi"><span> cho phép định hình các yêu cầu CORS cho dữ liệu đã nạp của phần tử</span></span> .</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Focus_management_in_HTML">Quản lý tập trung trong HTML</a></dt>
 <dd class="landingPageList">Thuộc tính <code><a href="/en-US/docs/Web/API/Document/activeElement">activeElement</a></code> DOM và phương thức <code><a href="/en-US/docs/Web/API/Document/hasFocus">hasFocus()</a></code> DOM giúp bạn<span id="result_box" lang="vi"><span> theo dõi và kiểm soát sự tương tác của người dùng với các phần tử trên một trang web.</span></span></dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Using_the_application_cache">Sử dụng bộ nhớ đệm (cache) của ứng dụng</a></dt>
 <dd class="landingPageList">Ứng dụng bộ nhớ đệm cho phép các ứng dụng dựa trên nền tảng web chạy offline. Bạn có thể sử dụng giao diện <strong>Application Cache</strong> (<em>AppCache</em>) <span id="result_box" lang="vi"><span>để cung cấp các tài nguyên mà trình duyệt lưu trữ và cung cấp cho người dùng ngoại tuyến</span></span>. <span id="result_box" lang="vi"><span>Các ứng dụng được lưu trữ trong bộ nhớ cache và hoạt động chính xác ngay cả khi người dùng Refresh lại khi đang ngoại tuyến.</span></span></dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content">Tải trước nội dung cùng với rel="preload"</a></dt>
 <dd class="landingPageList">Giá trị <code>preload</code> trong thuộc tính {{htmlattrxref("rel", "link")}} của phần ử {{htmlelement("link")}} cho phép bạn viết yêu cầu tìm kiếm khai báo trong thẻ HTML {{htmlelement("head")}} của bạn, xác định các nguồn tài nguyên mà trang bạn sẽ cần tới trước khi tải trang, thứ bạn muốn tải trước trong cái vòng tròn tải trang, trước cả khi trình duyệt chính thức hoàn lại nội dung vào đó. <span id="result_box" lang="vi"><span>Điều này đảm bảo rằng chúng được tạo sẵn, sớm hơn và ít có khả năng chặn render đầu tiên của trang, làm cải thiện hiệu suất</span></span>. Tóm lại bài này sẽ cho bạn hiểu cơ bản làm cách nào mà cái <code>preload</code> làm việc.</dd>
</dl>
</div>

<div class="section">
<h2 class="Documentation" id="Đại_kỳ_thư">Đại kỳ thư</h2>

<dl>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Reference">HTML kỳ kinh</a></dt>
 <dd class="landingPageList">Tất tần tật cá <strong>phần tử </strong>HTML, mỗi thứ có thể được sửa đổi bởi một số<strong> thuộc tính.</strong> Tài liệu HTML đã được kết nối với nhau bằng <a href="/en-US/docs/Web/HTML/Link_types">cái liên kết này</a>.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Element">Phần tử HTML kỳ kinh</a></dt>
 <dd class="landingPageList">Bách khoa toàn thư về <a class="glossaryLink" href="/en-US/docs/Glossary/HTML">Phần tử HTML</a>.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Attributes">Thuộc tính HTML kỳ kinh</a></dt>
 <dd class="landingPageList">Phần tử trong HTML có <strong>thuộc tính</strong>. Đó là việc bổ xung giá trị để định hình các phần tử hay điều chỉnh hành động của chúng nhiều cách khác nhau.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Global_attributes">Thuộc tính toàn cầu</a></dt>
 <dd class="landingPageList">Thuộc tính toàn cầu có thể áp đặt lên toàn bộ <a href="/en-US/docs/Web/HTML/Element">phần tử HTML</a>, <em>kể cả khi nó chả có trong tiêu chuẩn</em>. Có nghĩa là bất cứ pần tử không theo tiêu chuẩn nào vẫn phải bị áp đặt bởi mấy cái thuộc tính này, kể cả việc này không phù hợp với tài liệu HTML-5.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Inline_elements">Phần tử hướng nội</a> and <a href="/en-US/docs/Web/HTML/Block-level_elements">Phần tử phân khối</a></dt>
 <dd class="landingPageList">Phần tử HTML luôn luôn "inline" (hướng nội) hoặc "block-level" (phân khối). Phần tử inline chỉ chiếm không gian giới hạn bởi các thẻ định nghĩa nó. Phần tử block-level chiếm cả vùng không gian của phần tử cha mẹ (container - vùng chứa), và rồi tạo thành một "khối".</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Link_types">Phân loại liên kết</a></dt>
 <dd class="landingPageList">Trong HTML, các liên kết khác nhau có thể dùng để thiết lập mối quan hệ giữa hai tài liệu. Phần tử liên kết có thể được phân ra các loại <a href="/en-US/docs/Web/HTML/Element/a"><code>&lt;a&gt;</code></a>, <a href="/en-US/docs/Web/HTML/Element/area"><code>&lt;area&gt;</code></a>, và <a href="/en-US/docs/Web/HTML/Element/link"><code>&lt;link&gt;</code></a>.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Supported_media_formats">Định dạng đa phương tiện được hỗ trợ bởi phần tử audio và video</a></dt>
 <dd class="landingPageList">Phần tử <a href="/en-US/docs/Web/HTML/Element/audio"><code>&lt;audio&gt;</code></a> và <a href="/en-US/docs/Web/HTML/Element/video"><code>&lt;video&gt;</code></a> cho phép ta phát âm thanh và video. Mấy cái phần tử này cung cấp một trình phát của chính trình duyệt thay cho việc sử dụng Flash Player hay một vài phần mở rộng khác.</dd>
 <dt class="landingPageList"></dt>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Kinds_of_HTML_content">Các thể loại nội dung HTML</a></dt>
 <dd class="landingPageList">HTML bao gồm nhiều loại nội dung, mỗi trong số đó cho phép sử dụng trong một ngữ cảnh nhất định và không được phép ở chỗ khác. Tương tự, mỗi ths có một mục nội dung khác mà chúng có thể chứa và các phàn tử có thể hoặc không thể sử dụng ở bên trong chúng. Đây là hướng dẫn cho các loại này.</dd>
 <dt class="landingPageList"><a href="/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode">Chế độ không minh bạch và chế độ tiêu chuẩn</a></dt>
 <dd class="landingPageList">Biên niên sử về chế độ quirks (không minh bạch) và chế độ standards (tiêu chuẩn).</dd>
</dl>

<h2 class="landingPageList" id="Chủ_đề_liên_quan">Chủ đề liên quan</h2>

<dl>
 <dt><a href="/en-US/docs/Web/HTML/Applying_color">Áp dụng màu sắc vào HTML sử dụng CSS</a></dt>
 <dd>Bài này sẽ bao gồm nhiều cách sử dụng CSS để thêm màu vào nội dung HTML, liệt kê các phàn của tệp HTML có thể đổ màu và dùng thuộc tính CSS gì khi làm như vậy. Bao cả ví dụ, liên kết tới công cụ xây dựng bảng màu và nhiều hơn thế nữa.</dd>
</dl>
</div>
</div>
<span class="alllinks"><a href="/en-US/docs/tag/HTML">Xem tất...</a></span></section>