Giới thiệu về HTML

Khám phá HTML từ lịch sử của nó và các khối xây dựng cơ bản

HTML là một tiêu chuẩn được xác định bởiCÁI GÌ, từ viết tắt của Web Hypertext Application Technology Working Group, một tổ chức được thành lập bởi những người làm việc trên trình duyệt web phổ biến nhất. Điều này có nghĩa là về cơ bản nó được kiểm soát bởi Google, Mozilla, Apple và Microsoft.

Trong quá khứW3C(World Wide Web Consortium) là tổ chức chịu trách nhiệm tạo ra tiêu chuẩn HTML.

Việc kiểm soát chuyển từ W3C sang WHATWG một cách không chính thức khi rõ ràng rằng W3C thúc đẩy XHTML không phải là một ý kiến hay.

Nếu bạn chưa bao giờ nghe nói về XHTML, đây là một câu chuyện ngắn. Vào đầu những năm 2000, tất cả chúng ta đều tin rằng tương lai của Web là XML (nghiêm túc). Vì vậy, HTML đã chuyển từ là một ngôn ngữ soạn thảo dựa trên SGML sang một ngôn ngữ đánh dấu XML.

Đó là một sự thay đổi lớn. Chúng tôi phải biết và tôn trọng nhiều quy tắc hơn. Nội quy nghiêm ngặt hơn.

Cuối cùng các nhà cung cấp trình duyệt nhận ra đây không phải là con đường phù hợp cho Web và họ đã đẩy lùi, tạo ra cái mà bây giờ được gọi là HTML5.

W3C không thực sự đồng ý về việc để lại quyền kiểm soát HTML và trong nhiều năm, chúng tôi có 2 tiêu chuẩn cạnh tranh, mỗi tiêu chuẩn nhằm trở thành tiêu chuẩn chính thức. Cuối cùng vào ngày 28 tháng 5 năm 2019, W3C đã chính thức thông báo rằng phiên bản HTML “true” là phiên bản được xuất bản bởi WHATWG.

Tôi đã đề cập đến HTML5. Hãy để tôi giải thích câu chuyện nhỏ này. Tôi biết, cho đến giờ điều đó thật khó hiểu, cũng như nhiều thứ trong cuộc sống khi có nhiều diễn viên tham gia, nó cũng rất hấp dẫn.

Chúng tôi đã có phiên bản HTML 1 vào năm 1993. [Đây là RFC gốc].

HTML 2 tiếp theo vào năm 1995.

Chúng tôi cóHTML 3vào tháng 1 năm 1997, vàHTML 4 in December 1997.

Thời gian bận rộn!

Hơn 20 năm trôi qua, chúng ta đã có tất cả thứ XHTML này, và cuối cùng thì giờ đây chúng ta đã đạt được “thứ” HTML5 này, điều này không thực sựchỉ HTMLnữa không.

HTML5 là một thuật ngữ hiện định nghĩa một tập hợp toàn bộ các công nghệ, bao gồm HTML nhưng bổ sung thêm rất nhiều API và tiêu chuẩn như WebGL, SVG và hơn thế nữa.

Điều quan trọng cần hiểu ở đây là: bây giờ không có thứ gì (nữa) như một phiên bản HTML. Đó là một tiêu chuẩn sống. Giống như CSS, chúng tôi gọi nó là 3 nhưng trên thực tế đó là một loạt các mô-đun độc lập được phát triển riêng biệt. Giống như JavaScript, chúng tôi có một phiên bản mới mỗi năm, nhưng điều đó không quan trọng hơn là những tính năng riêng lẻ nào được công cụ triển khai.

Vâng, chúng tôi gọi nó là HTML5 nhưng HTML4 có từ năm 1997. Đó là một thời gian dài đối với bất cứ thứ gì, hãy tưởng tượng đối với web.

Đây là nơi tiêu chuẩn "sống": [https://html.spec.whatwg.org/multipage].

Khái niệm cơ bản về HTML

HTML là ngôn ngữ đánh dấu mà chúng tôi sử dụng để cấu trúc nội dung mà chúng tôi sử dụng trên Web.

HTML được cung cấp cho trình duyệt, theo những cách khác nhau.

Nó có thể được tạo bởi một ứng dụng phía máy chủ xây dựng nó tùy thuộc vào yêu cầu hoặc dữ liệu phiên, ví dụ như ứng dụng Rails hoặc Laravel hoặc Django.

Hoặc nó có thể được tạo bởi một ứng dụng phía máy khách JavaScript tạo HTML nhanh chóng.

Hoặc, trong trường hợp đơn giản nhất, nó có thể được lưu trữ thành một tệp và được phục vụ cho trình duyệt bởi một máy chủ Web.

Hãy đi sâu vào trường hợp này, mặc dù trong thực tế, đây có lẽ là cách ít phổ biến nhất để tạo HTML, nhưng điều cần thiết là phải biết các khối xây dựng cơ bản.

Theo quy ước, tệp HTML được lưu với.htmlhoặc là.htmsự mở rộng.

Bên trong tệp này, chúng tôi sắp xếp nội dung bằng cách sử dụngthẻ.

Các thẻ bao bọc nội dung và mỗi thẻ cung cấp một ý nghĩa đặc biệt cho văn bản mà nó bao bọc.

Hãy làm một vài ví dụ.

Đoạn mã HTML này tạo một đoạn văn bằng cách sử dụngpnhãn:

<p>A paragraph of text</p>

Đoạn mã HTML này tạo một danh sách các mục bằng cách sử dụngulthẻ, có nghĩa làdanh sách không có thứ tự, vàlithẻ, có nghĩa làmục danh sách:

<ul>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ul>

Khi một trang HTML được trình duyệt phân phát, các thẻ sẽ được diễn giải và trình duyệt hiển thị các phần tử theo các quy tắc xác định hình thức trực quan của chúng.

Một số quy tắc đó được tích hợp sẵn. Ví dụ như cách một danh sách hiển thị. Hoặc cách một liên kết được hiển thị bằng màu xanh lam, được gạch chân.

Một số quy tắc khác do bạn đặt ra với CSS.

HTML không phải là dạng trình bày. Nó không quan tâm đến việc mọi thứ như thế nàonhìn. Thay vào đó, nó quan tâm đến những thứnghĩa là.

Trình duyệt quyết định mọi thứ trông như thế nào, với các lệnh được xác định bởi người xây dựng trang, với ngôn ngữ CSS.

Bây giờ, 2 ví dụ tôi đã làm là các đoạn mã HTML được lấy bên ngoài ngữ cảnh trang.

Cấu trúc trang HTML

Hãy làm một ví dụ về một trang HTML thích hợp.

Mọi thứ bắt đầu với Khai báo loại tài liệu (hay còn gọi làkiểu tài liệu), một cách để cho trình duyệt biết đây là trang HTML và chúng tôi đang sử dụng phiên bản HTML nào.

HTML hiện đại sử dụng loại tài liệu này:

<!DOCTYPE html>

Sau đó, chúng tôi cóhtmlphần tử có thẻ mở và thẻ đóng:

<!DOCTYPE html>
<html>
...
</html>

Tất cả các thẻ đều có thẻ mở và thẻ đóng. Ngoại trừ một số thẻ tự đóng không cần thẻ đóng vì chúng không chứa bất cứ thứ gìtrong chúng.

Thẻ đóng giống như thẻ mở, nhưng có/.

Cáchtmlthẻ bắt đầu được sử dụng ở đầu tài liệu, ngay sau phần khai báo loại tài liệu.

Cáchtmlthẻ kết thúc là thứ cuối cùng xuất hiện trong tài liệu HTML.

Bên tronghtmlphần tử chúng ta có 2 phần tử:headbody:

<!DOCTYPE html>
<html>
	<head>
	...
	</head>
	<body>
	...
	</body>
</html>

Phía trongheadchúng tôi sẽ có các thẻ cần thiết để tạo một trang web, như tiêu đề, siêu dữ liệu, CSS và JavaScript bên trong hoặc bên ngoài. Chủ yếu là những thứ không trực tiếp xuất hiện trên trang mà chỉ giúp trình duyệt (hoặc các bot như bot tìm kiếm của Google) hiển thị đúng.

Phía trongbodychúng ta sẽ có nội dung của trang. Cácnhững thứ có thể nhìn thấy.

Thẻ so với các phần tử

Tôi đã đề cập đến các thẻ và phần tử. Có gì khác biệt?

Các phần tử có thẻ bắt đầu và thẻ đóng.

Trong trường hợp này, chúng tôi sử dụngpbắt đầu và đóng thẻ để tạopthành phần.

<p>A paragraph of text</p>

Vì vậy, một phần tử cấu thành toàn bộgói hàng:

  • thẻ bắt đầu
  • nội dung văn bản (và có thể là các yếu tố khác)
  • đóng thẻ

Nếu một phần tử không có thẻ đóng, nó chỉ được viết bằng thẻ bắt đầu và nó không thể chứa bất kỳ nội dung văn bản nào.

Điều đó nói rằng, tôi có thể sử dụng thẻ hoặc thuật ngữ phần tử trong cuốn sách có nghĩa tương tự, ngoại trừ tôi đề cập rõ ràng thẻ bắt đầu hoặc thẻ kết thúc.

Thuộc tính

Thẻ bắt đầu của một phần tử có thể có các đoạn thông tin đặc biệt mà chúng tôi có thể đính kèm, được gọi làthuộc tính.

Các thuộc tính cókey="value"cú pháp:

<p class="a-class">A paragraph of text</p>

Bạn cũng có thể sử dụng dấu ngoặc kép, nhưng sử dụng dấu ngoặc kép trong HTML là một quy ước tốt.

Chúng ta có thể có nhiều trong số chúng:

<p class="a-class" id="an-id">A paragraph of text</p>

và một số thuộc tính là boolean, nghĩa là bạn chỉ cần khóa:

<script defer src="file.js"></script>

Cácclassidthuộc tính là hai trong số những thuộc tính phổ biến nhất mà bạn sẽ thấy được sử dụng.

Chúng có một ý nghĩa đặc biệt và hữu ích trong cả CSS và JavaScript.

Sự khác biệt giữa hai là mộtidlà duy nhất trong ngữ cảnh của một trang web, nó không thể bị trùng lặp.

Mặt khác, các lớp có thể xuất hiện nhiều lần trên nhiều phần tử.

Thêm vào đó, mộtidchỉ là một giá trị.classcó thể chứa nhiều giá trị, được phân tách bằng dấu cách:

<p class="a-class another-class">A paragraph of text</p>

Thông thường sử dụng dấu gạch ngang-để tách các từ trong một giá trị lớp, nhưng nó chỉ là một quy ước.

Đó chỉ là 2 trong số các thuộc tính khả thi mà bạn có thể có. Một số thuộc tính chỉ được sử dụng cho một thẻ. Họ có chuyên môn cao.

Các thuộc tính khác có thể được sử dụng một cách tổng quát hơn. Bạn vừa thấyidclass, nhưng chúng tôi cũng có những cái khác, nhưstylecó thể được sử dụng để chèn các quy tắc CSS nội tuyến trên một phần tử.

Trường hợp không nhạy cảm

HTML không phân biệt chữ hoa chữ thường. Thẻ có thể được viết bằng tất cả chữ hoa hoặc chữ thường. Trong những ngày đầu, mũ lưỡi trai là tiêu chuẩn. Ngày nay chữ thường là tiêu chuẩn. Đó là một quy ước.

Bạn thường viết như thế này:

<p>A paragraph of text</p>

không phải như thế này:

<P>A paragraph of text</P>

Khoảng trắng

Khá quan trọng. Trong HTML, ngay cả khi bạn thêm nhiều khoảng trắng vào một dòng, nó sẽ được thu gọn bởi công cụ CSS của trình duyệt.

Ví dụ như kết xuất của đoạn văn này

<p>A paragraph of text</p>

giống như thế này:

<p>        A paragraph of text</p>

và tương tự như thế này:

<p>A paragraph

of text </p>

Sử dụngwhite-spaceThuộc tính CSSbạn có thể thay đổi cách mọi thứ hoạt động. Bạn có thể tìm thêm thông tin về cách CSS xử lý khoảng trắng trongThông số CSS

Tôi muốn nói rằng hãy sử dụng cú pháp giúp mọi thứ có tổ chức trực quan hơn và dễ đọc hơn, nhưng bạn có thể sử dụng bất kỳ cú pháp nào bạn thích.

Tôi thường định tuyến cho

<p>A paragraph of text</p>

hoặc là

<p>
	A paragraph of text
</p>

Các thẻ lồng nhau phải được thụt lề với 2 hoặc 4 ký tự, tùy thuộc vào sở thích của bạn:

<body>
	<p>
		A paragraph of text
	</p>
	<ul>
		<li>A list item</li>
	</ul>
</body>

Lưu ý: điều này có nghĩa là nếu bạn muốn thêm một khoảng trống bổ sung, nó có thể khiến bạn khá tức giận. Tôi đề nghị sử dụng CSS để tạo thêm không gian khi cần thiết.

Lưu ý: trong những trường hợp đặc biệt, bạn có thể sử dụng&nbsp;Thực thể HTML (một từ viết tắt có nghĩa làkhông gian không phá vỡ) - nhiều hơn về các thực thể HTML sau này. Tôi nghĩ điều này không nên lạm dụng. CSS luôn được ưu tiên để thay đổi bản trình bày trực quan.

Tiêu đề tài liệu

Cácheadthẻ chứa các thẻ đặc biệt xác định các thuộc tính tài liệu.

Nó luôn được viết trướcbodythẻ, ngay sau phần mở đầuhtmlnhãn:

<!DOCTYPE html>
<html>
	<head>
		...
	</head>
	...
</html>

Chúng tôi không bao giờ sử dụng các thuộc tính trên thẻ này. Và chúng tôi không viết nội dung trong đó.

Nó chỉ là một vùng chứa cho các thẻ khác. Bên trong nó, chúng ta có thể có nhiều loại thẻ, tùy thuộc vào những gì bạn cần làm:

  • title
  • script
  • noscript
  • link
  • style
  • base
  • meta

Cáctitlenhãn

Cáctitlethẻ xác định tiêu đề trang. Tiêu đề được hiển thị trong trình duyệt và nó đặc biệt quan trọng vì nó là một trong những yếu tố chính để Tối ưu hóa Công cụ Tìm kiếm.

Cácscriptnhãn

Thẻ này được sử dụng để thêm JavaScript vào trang.

Bạn có thể bao gồm nó nội dòng, sử dụng thẻ mở, mã JavaScript và sau đó là thẻ đóng:

<script>
..some JS
</script>

Hoặc bạn có thể tải tệp JavaScript bên ngoài bằng cách sử dụngsrcthuộc tính:

<script src="file.js"></script>

Cáctypethuộc tính theo mặc định được đặt thànhtext/javascript, vì vậy nó hoàn toàn là tùy chọn.

Có một số điều khá quan trọng cần biết về thẻ này.

Đôi khi thẻ này được sử dụng ở cuối trang. Tại sao? Vì lý do hiệu suất.

Việc tải tập lệnh theo mặc định sẽ chặn hiển thị trang cho đến khi tập lệnh được phân tích cú pháp và tải.

Làm như vậy, tập lệnh được tải và thực thi sau khi tất cả trang đã được phân tích cú pháp và tải, mang lại trải nghiệm tốt hơn cho người dùng khi giữ nó trongheadnhãn.

Ý kiến của tôi là bây giờ đây là thực hành xấu. Để choscriptsống ởheadnhãn.

Trong JavaScript hiện đại, chúng tôi có một giải pháp thay thế, hiệu quả hơn việc giữ tập lệnh ở cuối trang -deferthuộc tính:

<script defer src="file.js"></script>

Đây là tình huống kích hoạt đường dẫn nhanh hơn đến một trang được tải nhanh và JavaScript được tải nhanh.

Lưu ý:asyncthuộc tính tương tự, nhưng theo ý kiến của tôi, một lựa chọn tồi hơndefer. Tôi mô tả lý do tại sao chi tiết trong tranghttps://flaviocopes.com/javascript-async-defer/

Cácnoscriptnhãn

Thẻ này được sử dụng để phát hiện khi nào các tập lệnh bị tắt trong trình duyệt.

Lưu ý: người dùng có thể chọn tắt tập lệnh JavaScript trong cài đặt trình duyệt. Hoặc trình duyệt có thể không hỗ trợ chúng theo mặc định.

Nó được sử dụng khác nhau cho dù nó được đặt trong đầu tài liệu hay trong thân tài liệu.

Bây giờ chúng ta đang nói về đầu tài liệu, vì vậy trước tiên chúng ta hãy giới thiệu cách sử dụng này.

Trong trường hợp này,noscriptthẻ chỉ có thể chứa các thẻ khác:

  • linkthẻ
  • stylethẻ
  • metathẻ

để thay đổi các tài nguyên được cung cấp bởi trang hoặcmetathông tin, nếu tập lệnh bị vô hiệu hóa.

Trong ví dụ này, tôi đặt một phần tử vớino-script-alertlớp để hiển thị nếu các tập lệnh bị vô hiệu hóa, như nó đã từng làdisplay: nonetheo mặc định:

<!DOCTYPE html>
<html>
	<head>
		...
		<noscript>
			<style>
				.no-script-alert {
					display: block;
				}
			</style>
		</noscript>
	...
&lt;/<span style="color:#f92672">head</span>&gt;
...

</html>

Hãy giải quyết trường hợp khác: nếu được đặt trong phần nội dung, nó có thể chứa nội dung, như đoạn văn và các thẻ khác, được hiển thị trong giao diện người dùng.

Cáclinkđược sử dụng để đặt mối quan hệ giữa tài liệu và các tài nguyên khác.

Nó chủ yếu được sử dụng để liên kết một tệp CSS bên ngoài sẽ được tải.

Phần tử này không có thẻ đóng.

Sử dụng:

<!DOCTYPE html>
<html>
	<head>
		...
		<link href="file.css" rel="stylesheet">
		...
	</head>
	...
</html>

Cácmediathuộc tính cho phép tải các bảng định kiểu khác nhau tùy thuộc vào khả năng của thiết bị:

<link href="file.css" media="screen" rel="stylesheet">
<link href="print.css" media="print" rel="stylesheet">

Chúng tôi có thể liên kết đến các tài nguyên khác với bảng định kiểu.

Ví dụ, chúng tôi có thể liên kết nguồn cấp RSS bằng cách sử dụng

<link rel="alternate" type="application/rss+xml" href="/index.xml">

Chúng tôi có thể liên kết một biểu tượng yêu thích bằng cách sử dụng:

<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png">

<link rel=“icon” type=“image/png” sizes=“32x32” href="/assets/favicon-32x32.png">

<link rel=“icon” type=“image/png” sizes=“16x16” href="/assets/favicon-16x16.png">

Thẻ nàyđãcũng được sử dụng cho nội dung nhiều trang, để chỉ ra trang trước và trang sau bằng cách sử dụngrel="prev"rel="next". Mostly for Google. In 2019 Google thông báo không sử dụng thẻ này nữabởi vì nó có thể tìm thấy cấu trúc trang chính xác mà không có nó.

Cácstylenhãn

Thẻ này có thể được sử dụng để thêm kiểu vào tài liệu, thay vì tải một biểu định kiểu bên ngoài.

Sử dụng:

<style>
.some-css {}
</style>

Như vớilink, bạn có thể sử dụngmediađể chỉ sử dụng CSS đó trên phương tiện được chỉ định:

<style media="print">
.some-css {}
</style>

Bạn cũng có thể thêm thẻ này vào nội dung tài liệu. Nói về điều này, thật thú vịscopedđể chỉ gán CSS đó cho cây con tài liệu hiện tại. Nói cách khác, để tránh rò rỉ CSS ra bên ngoài phần tử mẹ.

Cácbasenhãn

Thẻ này được sử dụng để đặt URL cơ sở cho tất cả các URL tương đối có trong trang.

<!DOCTYPE html>
<html>
	<head>
		...
		<base href="https://flaviocopes.com/">
		...
	</head>
	...
</html>

Cácmetanhãn

Các thẻ meta thực hiện nhiều nhiệm vụ khác nhau và chúng rất, rất quan trọng.

Đặc biệt là đối với SEO.

metaphần tử chỉ có thẻ bắt đầu.

Điều cơ bản nhất làdescriptionthẻ meta:

<meta name="description" content="A nice page">

Điều nàycó thểđược Google sử dụng để tạo mô tả trang trong các trang kết quả của nó, nếu nó thấy nó mô tả trang tốt hơn nội dung trên trang (đừng hỏi tôi cách làm).

Cáccharsetthẻ meta được sử dụng để đặt mã hóa ký tự trang.utf-8trong hầu hết các trường hợp:

<meta charset="utf-8">

Cácrobotsthẻ meta hướng dẫn các bot của Công cụ tìm kiếm có lập chỉ mục một trang hay không:

<meta name="robots" content="noindex">

Hoặc nếu họ có nên theo liên kết hay không:

<meta name="robots" content="nofollow">

Bạn cũng có thể đặt nofollow trên các liên kết riêng lẻ. Đây là cách bạn có thể thiết lậpnofollowtrên toàn cầu.

Bạn có thể kết hợp chúng:

<meta name="robots" content="noindex, nofollow">

Hành vi mặc định làindex, follow.

Bạn có thể sử dụng các thuộc tính khác, bao gồmnosnippet,noarchive,noimageindexvà hơn thế nữa.

Bạn cũng có thể chỉ cho Google biết thay vì nhắm mục tiêutất cảcông cụ tìm kiếm:

<meta name="googlebot" content="noindex, nofollow">

và các công cụ tìm kiếm khác cũng có thể có thẻ meta của riêng chúng.

Nói về điều này, chúng ta có thể yêu cầu Google tắt một số tính năng. Điều này ngăn cản chức năng dịch trong kết quả của công cụ tìm kiếm:

<meta name="google" content="notranslate">

Cácviewportthẻ meta được sử dụng để yêu cầu trình duyệt đặt chiều rộng trang tùy thuộc vào chiều rộng thiết bị.

<meta name="viewport" content="width=device-width, initial-scale=1">

Xem thêm về thẻ này.

Một thẻ meta khá phổ biến khác làhttp-equiv="refresh"một. Dòng này yêu cầu trình duyệt đợi 3 giây, sau đó chuyển hướng đến trang khác:

<meta http-equiv="refresh" content="3;url=http://flaviocopes.com/another-page">

Sử dụng 0 thay vì 3 sẽ chuyển hướng sớm nhất có thể.

Đây không phải là tài liệu tham khảo đầy đủ, các thẻ meta khác ít được sử dụng hơn tồn tại.

Sau phần giới thiệu tiêu đề tài liệu này, chúng ta có thể bắt đầu đi sâu vào phần nội dung tài liệu.

Nội dung tài liệu

Sau thẻ head đóng, chúng ta chỉ có thể có một thứ trong tài liệu HTML:bodythành phần.

<!DOCTYPE html>
<html>
	<head>
		...
	</head>
	<body>
		...
	</body>
</html>

Giống nhưheadhtmlthẻ, chúng tôi chỉ có thể có mộtbodytrong một trang.

Bên trongbodychúng tôi có tất cả các thẻ xác định nội dung của trang.

Về mặt kỹ thuật, thẻ bắt đầu và thẻ kết thúc là tùy chọn. Nhưng tôi coi đó là một thực hành tốt để thêm chúng. Chỉ để rõ ràng.

Trong các chương tiếp theo, chúng tôi sẽ xác định nhiều loại thẻ mà bạn có thể sử dụng bên trong thân trang.

Nhưng trước đây, chúng ta phải giới thiệu sự khác biệt giữa các phần tử khối và các phần tử nội tuyến.

Phần tử khối so với phần tử nội tuyến

Các yếu tố hình ảnh, những yếu tố được xác định trong nội dung trang, thường có thể được phân loại thành 2 loại:

  • các phần tử khối (p,div, phần tử tiêu đề, danh sách và các mục danh sách,…)
  • các phần tử nội tuyến (a,span,img,…)

Sự khác biệt là gì?

Các phần tử khối, khi được định vị trong trang, không cho phép các phần tử khác bên cạnh chúng. Bên trái hoặc bên phải.

Các phần tử nội tuyến thay vào đó có thể nằm cạnh các phần tử nội tuyến khác.

Sự khác biệt cũng nằm ở các thuộc tính trực quan mà chúng ta có thể chỉnh sửa bằng CSS. Chúng ta có thể thay đổi chiều rộng / chiều cao, lề, phần đệm và đường viền hoặc các phần tử khối. Chúng tôi không thể làm điều đó cho các phần tử nội tuyến.

Lưu ý rằng sử dụng CSS, chúng ta có thể thay đổi giá trị mặc định cho từng phần tử, thiết lậppví dụ: thẻ được nội dòng, hoặcspantrở thành một phần tử khối.

Một sự khác biệt nữa là các phần tử nội tuyến có thể được chứa trong các phần tử khối. Điều ngược lại là không đúng sự thật.

Một số phần tử khối có thể chứa các phần tử khối khác, nhưng nó phụ thuộc. Cácpví dụ như thẻ không cho phép tùy chọn như vậy.

Tải xuống miễn phí của tôiSổ tay HTML


Các hướng dẫn html khác: