[HTML 2]Các thành phần chính của HTML

3
265

Chào mọi người, ở phần 2 của series học html căn bản này, AD sẽ hướng dẫn các bạn các thành phần chính của html, để các bạn có thể tự tạo nên được một file HTML, từ giờ AD viết HTML là html nhé 😀 . Mặc dù hiện nay có rất nhiều các CMS hỗ trợ các bạn làm web nhưng theo ad thì vẫn nên học code html, vì nhiều lí do, thế nên AD vẫn quyết định mở khóa tự học html này ^^

 

Học HTML

 

Đây là một ví dụ cơ bản về file html

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

 

AD sẽ giải thích ý nghĩa của từng câu lệnh một :

+<!DOCTYPE html> : lệnh này đơn giản là giúp trình duyệt hiểu được bạn đang dung ngôn ngữ html trong phần dưới.

+<html></html> : cung cấp thông tin về đoạn mã html được xét trong nó.

+<head></head> : cung cấp thông tin cho trình duyệt và người đọc về thông tin mà bạn thấy được trong html.

+<title></title> : cung cấp tiêu đề của tài liệu html .

+<body></body> : Cung cấp thông tin, hiển thị phần “có thể nhìn thấy” của tệp html.

+<h1></h1> ; Cung cấp thông tin của heading.

+<p></p> : biểu thị một đoạn văn.

 

Việc sử dụng đầy đủ và chính xác các thành phần trong html sẽ giúp cho trình duyệt hiểu đúng và đủ được thông tin mà bạn muốn hiểu thị trong tệp đó.

 

1.Thẻ HTML ( HTML Tags)

Thẻ HTML là cặp thẻ được đặt trong cặp sau

<tên thẻ> nội dung </tên thẻ>

Thẻ html thì được chia ra thành ba phần chính, là thẻ mở đầu ( Opening tags), nội dung thẻ ( Content) và thẻ kết thúc ( End/Closing tags), thẻ kết thúc thì giống hệt thẻ mở đầu, tuy nhiên thì trước thẻ kết thúc có một dấu sổ chéo dạng “/” ( không có dấu nháy kép nhé )

 

2. Trình duyệt và việc đọc tệp html

Mục đích chính của trình duyệt là tìm và đọc các thẻ HTML, tất nhiên là nó sẽ không hiển thị các thẻ mà nó sẽ dùng các thẻ ấy để biết được phần content trong thẻ được hiển thị như thế nào và hiển thị nó ra màn hình máy tính đúng cách. Trình duyệt là gì chắc không còn xa lạ với mọi người, nếu không thì bạn hiểu đơn giản là cái  giúp bạn đang vào và đọc được bài này gọi là trình duyệt.

 

3. Cấu trúc tệp html

 

<html>

  <head>

     <title> Site title</title>

</head>

  <body>

     <h1> heading 1</h1>
     <p>Đoạn văn 1<./p>
     <h2>Heading 2</h2>

</body>

</html>

 

Chú ý ; Chỉ nội dung trong thẻ body mới được trình duyệt hiển thị ra ngoài màn hình

 

4.Thẻ <!DOCTYPE>

Thẻ này giúp cho việc hiển thị tệp html được chính xác hơn, không phải là vì bạn code tệp sai, mà là hiển thị đúng với phiên bản html mà bạn đã dung để soạn thảo tệp.

Thẻ <!DOCTYPE>  không phân biệt chữ hoa chữ thường, bạn viết thế nào cũng sẽ được chấp nhận, dù là HTMl, HtmL, html, hay là Html cũng không quan trọng.

Phần sau thẻ DOCTYPE thì tùy phiên bản HTML bạn đang dung mà khai báo cho đúng, và đây là một số cách khai báo của các loại html

 

HTML5

 

<!DOCTYPE html>

 

HTML 4.01

 

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

 

( Dài hơn nhiều phải không)

 

XHTML 1.0

 

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

 

Nhắc lại một lần nữa là AD chỉ dùng html5 trong serie này nhé.

Một số phiên bản HTML cơ bản đây

 

 

Phiên bản
Năm phát hành
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014

 

3 COMMENTS

LEAVE A REPLY

Please enter your comment!
Please enter your name here