<p>Trong b&agrave;i viết n&agrave;y, <a href="https://tek4.vn/">Tek4.vn </a>sẽ chia sẻ cho bạn những kiến thức xoay quanh thuật ngữ HTML : HTML l&agrave; g&igrave;? HTML được d&ugrave;ng để l&agrave;m g&igrave;? những th&agrave;nh phần n&agrave;o tạo n&ecirc;n cấu tr&uacute;c cơ bản của một trang HTML ? HTML hoạt động như thế n&agrave;o?</p>
<p><img style="width: 100%;" src="https://tek4.vn/public_files/ea4aa37e-ae50-4625-b7cb-9561abd15252" alt="html l&agrave; g&igrave; 1" /></p>
<h2>HTML l&agrave; g&igrave;?</h2>
<p><strong>HTML</strong> (Hypertext Markup Language - ng&ocirc;n ngữ đ&aacute;nh dấu si&ecirc;u văn bản). N&oacute; sẽ tạo ra c&aacute;c từ kh&oacute;a v&agrave; lệnh để sử dụng trong qu&aacute; tr&igrave;nh tạo trang web.</p>
<p>Si&ecirc;u văn bản l&agrave; dạng văn bản t&iacute;ch hợp với c&aacute;c đường link. Khi người đọc nhấp v&agrave;o đ&oacute; th&igrave; n&oacute; sẽ dẫn sang 1 trang kh&aacute;c hoặc một phần n&agrave;o đ&oacute; của ch&iacute;nh trang đ&oacute;. Trong khi đ&oacute;, ng&ocirc;n ngữ đ&aacute;nh dấu sử dụng thẻ hoặc văn bản thuần t&uacute;y (plain text) chứa&nbsp; dấu đặc biệt d&ugrave;ng để x&aacute;c định c&aacute;c phần của trang, chẳng hạn như đầu trang v&agrave; ch&acirc;n trang v&agrave; c&aacute;c ph&acirc;n kh&aacute;c như bảng v&agrave; h&igrave;nh ảnh.</p>
<p>HTML được coi l&agrave; một trong ba c&ocirc;ng cụ thiết yếu trong việc tạo trang web:&nbsp;<strong>HTML</strong> sẽ gi&uacute;p ta cấu tr&uacute;c h&oacute;a văn bản, h&igrave;nh ảnh, v.v. xuất hiện tr&ecirc;n trang web. CSS (tập tin định kiểu theo tầng) phụ tr&aacute;ch sắp xếp c&aacute;c thuộc t&iacute;nh trực quan của c&aacute;c phần tử chẳng hạn như m&agrave;u sắc, định dạng v&agrave; bố cục. Trong khi đ&oacute;, Javascript đ&oacute;ng vai tr&ograve; gi&uacute;p c&aacute;c phần tử n&agrave;y hoạt động theo những c&aacute;ch nhất định,&nbsp; t&ugrave;y thuộc v&agrave;o h&agrave;nh động của người d&ugrave;ng. V&iacute; dụ: k&iacute;ch thước ph&ocirc;ng chữ của văn bản c&oacute; thể tăng l&ecirc;n khi người d&ugrave;ng di chuột hoặc nhấp v&agrave;o n&uacute;t tr&ecirc;n trang.</p>
<p>Để viết dạng ng&ocirc;n ngữ <strong>HTML</strong>, bạn sẽ d&ugrave;ng c&aacute;c tr&igrave;nh soạn thảo văn bản, như Notepad, Brackets hoặc Atom.&nbsp;<strong>C&aacute;c</strong> tr&igrave;nh văn bản HTML n&agrave;y sẽ đảm bảo phần m&atilde; h&oacute;a lu&ocirc;n ngắn gọn v&agrave; hiệu quả. Ch&uacute;ng c&oacute; chức năng gi&uacute;p giảm lỗi bằng c&aacute;ch tự động ch&egrave;n thẻ (tự động điền) v&agrave; c&aacute;c phần tử quen thuộc kh&aacute;c hoặc th&ocirc;ng qua việc gỡ lỗi (debug).</p>
<h2><strong>HTML được d&ugrave;ng để l&agrave;m g&igrave;? &nbsp;</strong></h2>
<p><strong>HTML</strong> l&agrave; ng&ocirc;n ngữ mặc định của c&aacute;c trang web v&agrave; t&agrave;i liệu tr&ecirc;n web. N&oacute; gi&uacute;p tr&igrave;nh duyệt c&oacute; thể nắm được cấu tr&uacute;c v&agrave; bố cục của t&agrave;i liệu hoặc tệp khi xem qua internet. N&oacute; cho ph&eacute;p c&aacute;c trang web của bạn lưu trữ &acirc;m thanh, video, bảng t&iacute;nh v&agrave; c&aacute;c ứng dụng kh&aacute;c. N&oacute; cũng đ&oacute;ng vai tr&ograve; điều hướng trong c&aacute;c trang web hoặc giữa c&aacute;c trang web th&ocirc;ng qua si&ecirc;u văn bản.</p>
<p>Hơn nữa, những người l&agrave;m trang web c&oacute; thể sử dụng <strong>HTML</strong> để thiết kế biểu mẫu để ứng dụng trong việc đặt h&agrave;ng sản phẩm, đặt chỗ hoặc t&igrave;m kiếm th&ocirc;ng tin. Do đ&oacute;, HTML ch&iacute;nh l&agrave; khối x&acirc;y dựng cơ bản trong rất nhiều ứn dụng như: x&acirc;y dựng thương hiệu v&agrave; điều h&agrave;nh một trang web thương mại điện tử hoặc một doanh nghiệp dựa tr&ecirc;n đăng k&yacute; trực tuyến.</p>
<h2>L&agrave;m thế n&agrave;o để tạo 1 văn bản HTML?</h2>
<p>C&aacute;c th&agrave;nh phần ch&iacute;nh của 1 văn bản HTML l&agrave; c&aacute;c thẻ v&agrave; c&aacute;c phần tử. Ch&uacute;ng gi&uacute;p cho tr&igrave;nh duyệt biết c&aacute;ch hiển thị nội dung m&agrave; ta cần. Thẻ (Tag) mở v&agrave; đ&oacute;ng với dấu ngoặc g&oacute;c &ldquo;⟨ ⟩&rdquo;)hoặc c&aacute;c dấu nhỏ hơn&nbsp; "&lt;" v&agrave; lớn hơn "&gt;". C&aacute;c chữ c&aacute;i giữa ch&uacute;ng được gọi l&agrave; nội dung của phần tử.</p>
<p>Sau đ&acirc;y l&agrave; những th&agrave;nh phần tạo n&ecirc;n cấu tr&uacute;c cơ bản của một trang HTML (duwak theo thứ tự xuất hiện):</p>
<h3>Định nghĩa kiểu dữ liệu&nbsp; (DTD)</h3>
<p>&lt;!DOCTYPE html&gt; xuất hiện ở đầu hoặc tr&ecirc;n c&ugrave;ng của một văn bản HTML. N&oacute; cho tr&igrave;nh duyệt biết phi&ecirc;n bản HTML n&agrave;o đ&atilde; được sử dụng để tạo trang.</p>
<h3>Phần tử gốc HTML</h3>
<p>C&aacute;c&lt;html&gt; , được viết b&ecirc;n dưới dạng DTD, hoạt động giống như chiếc &ldquo;container ch&iacute;nh" chứa tất cả c&aacute;c phần tử kh&aacute;c. N&oacute; d&ugrave;ng để chỉ định loại ng&ocirc;n ngữ của HTML. Chẳng hạn &lt;html lang="en-US"&gt; C&oacute; nghĩa l&agrave; trang được viết bằng tiếng Anh Mỹ.&lt;/html&gt;</p>
<h3>Phần tử &lt;head&gt;</h3>
<p>&lt;head&gt; l&agrave; phần tử nằm giữa&lt;html&gt; v&agrave;&lt;body&gt; , chứa si&ecirc;u dữ liệu m&ocirc; tả th&ocirc;ng tin về trang, bao gồm:</p>
<ul>
<li>Phần tử <strong>&lt;title&gt; </strong>&nbsp;hiển thị phần ti&ecirc;u đề ch&iacute;nh của cả trang web. Phần tử n&agrave;y đứng ri&ecirc;ng biệt, nhưng phải phải khớp với thẻ d&ograve;ng headline xuất hiện trong phần nội dung.</li>
<li>Phần tử <strong>&lt;style&gt;</strong> sẽ định nghĩa kiểu/bố cục của tr&igrave;nh duyệt. Bao gồm m&agrave;u sắc của d&ograve;ng ti&ecirc;u đề, căn chỉnh văn bản, m&agrave;u nền của nội dung, v.v.</li>
<li>Phần tử <strong>&lt;link&gt;</strong> sẽ li&ecirc;n kết c&aacute;c t&agrave;i nguy&ecirc;n như một trang web kh&aacute;c hoặc trang định kiểu b&ecirc;n ngo&agrave;i với trang HTML.</li>
<li>Phần tử <strong>&lt;meta&gt;</strong> chứa từ kh&oacute;a, th&ocirc;ng tin về t&aacute;c giả v&agrave; trang.</li>
<li>Phần tử <strong>&lt;base&gt;</strong> x&aacute;c định c&aacute;c URL mặc định.</li>
</ul>
<h3>Phần tử &lt;body&gt;</h3>
<p>Phần tử &lt;body&gt; l&agrave; phần ch&iacute;nh của t&agrave;i liệu chứa nội dung hiển thị tr&ecirc;n m&agrave;n h&igrave;nh, bao gồm c&aacute;c phần tử nhỏ hơn như sau:</p>
<ul>
<li>C&aacute;c đặc trưng về <strong>header</strong> gồm c&oacute; ti&ecirc;u đề trang, logo, bảng điều hướng ch&iacute;nh v&agrave; thanh t&igrave;m kiếm.</li>
<li>Phần <strong>content</strong> ch&iacute;nh bao gồm ti&ecirc;u đề lớn hoặc ti&ecirc;u đề b&agrave;i b&aacute;o, nội dung b&agrave;i viết, ng&agrave;y đăng, t&aacute;c giả, v.v.</li>
<li>C&aacute;c<strong> sidebar</strong> hiển thị c&aacute;c widget v&agrave; bảng điều hướng phụ, chẳng hạn như c&aacute;c kho lưu trữ theo danh mục hoặc ng&agrave;y th&aacute;ng.</li>
<li>Phần <strong>footer </strong>(ch&acirc;n trang) cung cấp th&ocirc;ng tin li&ecirc;n hệ, li&ecirc;n kết về mạng x&atilde; hội, bản quyền v&agrave; điều hướng cấp ba.</li>
</ul>
<h2>HTML hoạt động như thế n&agrave;o?</h2>
<p>T&aacute;c giả trang web sẽ nhập t&agrave;i liệu HTML được lưu với đu&ocirc;i .html hoặc .htm (filename.html hoặc filename.htm). Sau đ&oacute;, tệp n&agrave;y được tải l&ecirc;n Worldwide Web, nơi sẽ hiển thị h&igrave;nh thức trực tuyến của tệp.</p>
<p>Để mở tệp HTML từ PC của bạn, h&atilde;y truy cập File Explorer, nhấp chuột phải v&agrave;o tệp (hoặc nhấp đ&uacute;p v&agrave;o tệp nếu bạn đang sử dụng Mac) v&agrave; chọn "Open With&rdquo; từ menu để khởi chạy trong tr&igrave;nh duyệt. Google Chrome, Mozilla Firefox, Safari v&agrave; c&aacute;c tr&igrave;nh duyệt kh&aacute;c cũng c&oacute; thể nhận dạng v&agrave; đọc định dạng n&agrave;y. Ta cũng c&oacute; thể khởi chạy tr&igrave;nh duyệt của m&igrave;nh, nhấn Ctrl + O để k&eacute;o l&ecirc;n menu "mở" v&agrave; nhấp đ&uacute;p v&agrave;o tệp html.</p>
<p>C&aacute;c tr&igrave;nh duyệt sử dụng c&aacute;c phần tử HTML để diễn giải nội dung của trang v&agrave; hiển thị ch&uacute;ng một c&aacute;ch ch&iacute;nh x&aacute;c tr&ecirc;n m&agrave;n h&igrave;nh một c&aacute;ch gọn g&agrave;ng v&agrave; c&oacute; định dạng.</p>
<p>Hy vọng b&agrave;i viết tr&ecirc;n của Tek4.vn đ&atilde; gi&uacute;p bạn c&oacute; th&ecirc;m những kiến thức xoay quanh thuật ngữ HTML, c&oacute; thể hiểu r&otilde; hơn về định nghĩa HTML l&agrave; g&igrave;, HTML được d&ugrave;ng để l&agrave;m g&igrave; v&agrave; HTML hoạt động như n&agrave;o.</p>

Admin

HTML là gì? chia sẻ những kiến thức xoay quanh thuật ngữ HTML

Cùng tác giả

Admin

Có liên quan