Liên hệ
Ủng hộ, đăng ký theo dõi kênh

Khái quát về HTML

Những khái niệm cơ bản trong HTML, ứng dụng trong trình bày các trang web.

Chào mừng đến với HTML

 HTML viết tắt của chữ HyperText Markup Language (Ngôn ngữ đánh dấu siêu văn bản). Được gọi là ngôn ngữ nhưng nó không giống như các ngôn ngữ kịch bản sử dụng các kịch bản để thi hành các tác vụ, ngôn ngữ đánh dấu lại sử dụng các THẺ để xác định nội dung (Chỉ nội dung chứ không thi hành tác vụ).

Đây là một ví dụ về thẻ HTML: Hiện thị trang có nội dung - Hello worl!.

<p> Hello world! </p>

Cấu trúc của một trang Web: Việc sử dụng các mã HTML là kiến thức cơ bản cần thiết cho bất kỳ người phát triển website nào. Hầu hết họ phải phát triển kỹ năng làm Web của mình bắt đầu từ việc học để tạo trang nội dung Web từ HTML. 

Với một trang Web hiện đại thường thấy có các thành phần sau:

  • HTML: Mô tả cấu trúc của trang (các nội dung xuất hiện trên trang theo một cấu trúc).
  • CSS: Trình bày cấu trúc (Định dạng, format  ... như màu sắc, canh lề, font chữ ...).
  • JavaScript: Các ứng xử của trang (tương tác với người dùng, thi hành các tác vụ khi trang web đã được tải về ...).

Thẻ HTML <html>

Trải quả nhiều năm phát triển có nhiều phiên bản HTM được đưa ra tuy nhiên các vấn đề cơ bản của HTML vẫn không đổi. Cấu trúc một trang HTML được so sánh với cái bánh sandwich. Chiếc bánh có hai lát bánh giống như HTML có thẻ mở và thẻ đóng vào kẹp giữa nó là các thứ khác.  Và thẻ có tên html là gốc, bao bọc toàn bộ trang.

 

sandwich - html

Thẻ HTML có dạng như sau:

<html> ... </html>

Thẻ <head>

Đây là thẻ theo sau ngay khi mở thẻ html, nghĩa là bạn tìm thấy nó ở phần đầu của văn bản HTML.  Thẻ head chứa các thành phần  hầu như là không hiện thị tới người dùng nhưng là các điều khiển giúp trang web hoạt động theo một mục đích cụ thể.

<html>
   <head></head>
</html>

Thẻ <body>

Thẻ body theo sau thẻ head. Những thành phần hiện thị tới người dùng phải đưa vào thẻ này ví dụ như: các tiêu đề (heading), các khối văn bản (paragraph), các danh sách (list), trích dẫn (quote), hình ảnh (image), các liên kết (link) ... 

Đến đây có một cấu trúc trang HTML cơ bản nh

<html>
   <head>
      ... trình bày các thành phần không hiện thị ở đây
   </head>
   <body>
      ... trình bày các thành phần hiện thị ở đây
   </body>
</html>

Tạo trang HTML đầu tiên

Để soạn thảo file HTML bạn có thể dùng bất trình trình soạn thảo text đơn giản nào như Notepad, Notepad++ để soạn thảo. Ghi lại file có đuôi .html hoặc .htm. Để kiểm tra mở file đó bằng trình duyệt như Chrome, Firefox ...

Dùng Notepad tạo một nội dung như sau:

<html>
   <head>
   </head>
   <body>
      Chào tất cả mọi người! 
   </body>
</html>

Sau đó lưu lại đặt tên file có phần đuôi (mở rộng) là .html hoặc .html. Ví dụ lưu thành file vidu1.html.

html - notepad

Sau đó mở file đã lưu vidu1.html trong trình duyệt, sẽ thấy kết quả của trang:

Trang web vidu1

Thẻ <title>

Thẻ title nằm trong thẻ head. Nó diễn tả tiêu đề của trang web, tiêu đề này hiện thị trên cửa sổ trình duyệt (tiêu đề tab). Mặc dù không bắt buộc nhưng mọi trang web nên có thẻ này.

<html>
   <head>
      <title>Trang 1</title>
   </head>
   <body>
      Chào tất cả mọi người. 
   </body>
</html>

Kết quả như sau:

webpage2

 

Vui lòng đăng ký ủng hộ kênh