HTML là một trong những ngôn ngữ quan trọng và không thể thiếu trong lập trình web . HTML cho phép trình duyệt hiểu đánh dấu của tất cả các đối tượng trên trang web, từ trường văn bản đến nút, âm thanh, video và nhiều hơn nữa. Bài viết này sẽ giúp bạn hiểu các kiến thức cơ bản nhất về lập trình web html . Cùng tìm hiểu nhé!
Thông tin về HTML
HTML là viết tắt của HyperText Markup Language, một ngôn ngữ đánh dấu siêu văn bản được sử dụng rộng rãi để xây dựng các trang web và tài liệu. Không có HTML, các trang web hiện đại không thể tồn tại được. HTML là ngôn ngữ chủ đạo trong việc xây dựng các trang web trên toàn thế giới.
Mỗi năm, các nhà phát triển HTML liên tục cập nhật và cải tiến ngôn ngữ này. Hiện nay, tiêu chuẩn HTML5 đã chính thức phát hành từ năm 2014. Đây là một bước ngoặc đáng chú ý cho ngôn ngữ lập trình web này.
Một số đổi mới trong HTML5 bao gồm:
- Thuật toán phân tích cú pháp đã thay đổi, giúp tạo cấu trúc DOM dễ dàng hơn.
- Các thẻ mới đã xuất hiện, như thẻ âm thanh, video và nhiều thẻ khác. Bạn có thể tạo một trình phát web chỉ bằng HTML, mà trước đây bạn phải sử dụng Adobe Flash Player.
- Định nghĩa lại một phần của các quy tắc và ngữ nghĩa khi sử dụng các phần tử HTML.
Công cụ phục vụ lập trình web HTML
Trình soạn thảo văn bản
Công cụ chính để lập trình web HTML là một trình soạn thảo văn bản. Một trong những trình soạn thảo phổ biến và linh hoạt nhất là Notepad++. Đây là một công cụ miễn phí với đầy đủ các chức năng cần thiết và nhiều plugin hữu ích, như đóng mở thẻ.
Một trình soạn thảo tốt khác là Visual Studio Code, hỗ trợ trên nhiều hệ điều hành như MacOS và Windows. Visual Studio Code có khả năng vượt trội so với Notepad++.
Trình duyệt web
Trình duyệt web là công cụ quan trọng thứ hai cho lập trình web HTML, giúp kiểm tra mã nguồn. Bất kỳ trình duyệt web hiện đại nào cũng có tính năng này. Nếu bạn cần phát triển một ứng dụng đa nền tảng, bạn cần cài đặt các trình duyệt web phổ biến trên hệ thống của mình.
Cấu trúc của tài liệu HTML
Cấu trúc chung của trang web
Một tài liệu HTML bao gồm văn bản - nội dung thông tin và các tính năng đặc biệt của ngôn ngữ HTML, cùng với các thẻ đánh dấu - xác định cấu trúc và hình thức của tài liệu khi nó được hiển thị trên trình duyệt.
Cấu trúc chung của tài liệu HTML bao gồm:
- Phần DOCTYPE chỉ định loại tài liệu và phiên bản ngôn ngữ đánh dấu được sử dụng. Nó cũng chỉ định tên và vị trí định nghĩa kiểu tài liệu (DTD).
- Văn bản của tài liệu được đặt trong thẻ
. Văn bản của tài liệu bao gồm tiêu đề và nội dung, được phân tách bằng thẻvàtương ứng. - Tiêu đề
chỉ định tên của tài liệu HTML và các thông số khác mà trình duyệt sẽ sử dụng khi hiển thị tài liệu. - Phần thân của tài liệu
chứa nội dung thực của tài liệu HTML. Phần nội dung bao gồm văn bản sẽ được hiển thị và các thẻ điều khiển của tài liệu (thẻ) được trình duyệt sử dụng.
Xem thêm:
DOCTYPE
Phần DOCTYPE giúp trình duyệt biết loại tài liệu và phiên bản ngôn ngữ đánh dấu được sử dụng. Nó cũng chỉ định tên và phạm vi mô tả ngôn ngữ và địa chỉ của tệp DTD (định nghĩa kiểu tài liệu).
Tiêu chuẩn yêu cầu phần DOCTYPE có mặt trong tài liệu, giúp việc xử lý siêu văn bản nhanh chóng và hiệu quả hơn. Khi có phần DOCTYPE, trình duyệt không phải đưa ra giả định về cách giải thích các thẻ, mà thay vào đó tham khảo định nghĩa tiêu chuẩn (tệp DTD). Thông tin chi tiết về DOCTYPE có trên trang web của W3C.
Thẻ HTML
Thẻ (thẻ HTML, thẻ đánh dấu) là một chuỗi ký tự điều khiển chỉ định cách hiển thị thông tin siêu văn bản. Thẻ HTML bao gồm một tên ngay sau đó là danh sách các thuộc tính tùy chọn. Toàn bộ thẻ (bao gồm các thuộc tính) được đặt trong dấu ngoặc nhọn <>:
Theo quy tắc, các thẻ có thể nối tiếp nhau. Trong thẻ mở và thẻ đóng, thông tin sẽ được đặt. Tên thẻ đóng giống với tên thẻ mở, nhưng trước tên thẻ đóng có dấu gạch chéo / ( … ). Thẻ đóng không bao giờ chứa thuộc tính. Một số thẻ không có thẻ đóng, ví dụ như thẻ
Các thẻ có thể lồng vào nhau, với định dạng thẻ bên trong ưu tiên hơn so với thẻ bên ngoài. Khi sử dụng các thẻ lồng nhau, chúng cần được đóng lại từ thẻ gần nhất và di chuyển dần lên thẻ đầu tiên.
Thẻ meta
Thẻ meta HTML là một phần tử đánh dấu HTML mô tả các thuộc tính của tài liệu (siêu dữ liệu). Mục đích của thẻ meta được xác định bởi tập hợp các thuộc tính của nó, được chỉ định trong thẻ .
Thẻ meta được đặt trong khối … của trang web. Chúng không bắt buộc, nhưng có thể rất hữu ích.
Các thuộc tính
Các thuộc tính là các cặp "property = value", chỉ định cách trình bày của thẻ tương ứng:
Thứ tự các thuộc tính trong thẻ không quan trọng. Nếu giá trị của thuộc tính là một từ hoặc số, thì nó có thể được chỉ định đơn giản sau dấu "=" mà không cần phải thêm dấu ngoặc kép. Tuy nhiên, nếu giá trị chứa nhiều từ được phân tách bằng dấu cách, thì cần đặt giá trị trong dấu ngoặc kép.
Thuộc tính có thể bắt buộc hoặc tùy chọn. Thuộc tính tùy chọn có thể bỏ qua. Nếu không chỉ định thuộc tính bắt buộc, nội dung của thẻ có thể hiển thị không chính xác.
Siêu liên kết
Siêu liên kết là một phần của trang web (văn bản, hình ảnh, v.v.) được đánh dấu theo cách đặc biệt và liên kết với một tài liệu khác. Thẻ được sử dụng để tạo các siêu liên kết này, cho phép bạn điều hướng giữa các trang web liên quan.
Các ký tự đặc biệt
Ngoài các thẻ, còn có một số ký tự đặc biệt xuất hiện trong lập trình web HTML. Ví dụ, © là dấu hiệu bản quyền. Để hiển thị các ký tự đặc biệt này, bạn có thể sử dụng mã ghi nhớ hoặc mã số biểu thức & tên; hoặc & # NNNN;, trong đó NNNN là mã Unicode thập phân của ký tự.
Một số ký tự đặc biệt: & (mã số ©) - dấu và (&), < - dấu nhỏ hơn (<) và > - dấu lớn hơn (>), « - dấu ngoặc kép đánh máy bên trái ("), v.v.
Đó là những kiến thức cơ bản về lập trình web HTML mà VnSkills Academy muốn giới thiệu đến bạn. Chúc quá trình học tập của bạn đạt được kết quả tốt, và bạn sẽ trở thành một lập trình viên chuyên nghiệp trong thời gian sớm nhất!
