Hướng dẫn learn html5 for free - học html5 miễn phí

Dễ học với html "hãy tự mình thử"

Với trình chỉnh sửa "Hãy thử chính mình" của chúng tôi, bạn có thể chỉnh sửa mã HTML và xem kết quả:

Thí dụ

Tiêu đề trang


Page Title

Đây là một tiêu đề này là một đoạn văn.

This is a paragraph.


Hãy tự mình thử »

Nhấp vào nút "Hãy tự mình thử" để xem nó hoạt động như thế nào.

Ví dụ HTML

Trong hướng dẫn HTML này, bạn sẽ tìm thấy hơn 200 ví dụ. Với trình soạn thảo "Hãy thử trực tuyến của chúng tôi", bạn có thể tự chỉnh sửa và kiểm tra từng ví dụ!

Truy cập ví dụ HTML!

Bài tập HTML

Hướng dẫn HTML này cũng chứa gần 100 bài tập HTML.

Kiểm tra bản thân với các bài tập

Exercise:

Thêm "ToolTip" vào đoạn văn bên dưới với văn bản "Giới thiệu về W3Schools".

W3Schools là trang web của nhà phát triển web.

Bắt đầu bài tập

Bài kiểm tra bài kiểm tra HTML

Kiểm tra các kỹ năng HTML của bạn với bài kiểm tra HTML của chúng tôi!

Bắt đầu bài kiểm tra HTML!

Việc học của tôi

Theo dõi tiến trình của bạn với chương trình "Học tập" miễn phí tại đây tại W3Schools.

Đăng nhập vào tài khoản của bạn và bắt đầu kiếm điểm!

Đây là một tính năng tùy chọn. Bạn có thể học W3Schools mà không cần sử dụng học tập của tôi.

Tài liệu tham khảo HTML

Tại W3Schools, bạn sẽ tìm thấy các tài liệu tham khảo đầy đủ về các phần tử, thuộc tính, sự kiện, tên màu, thực thể, bộ ký tự, mã hóa URL, mã ngôn ngữ, tin nhắn HTTP, hỗ trợ trình duyệt, v.v.


Khởi động sự nghiệp của bạn

Được chứng nhận bằng cách hoàn thành khóa họcthe course

Được chứng nhận

W3SchoolScertified.2022


Về khóa học này

Sự thật thú vị: Tất cả các trang web sử dụng HTML - ngay cả trang này. Nó là một phần cơ bản của mọi bộ công cụ phát triển web. HTML cung cấp nội dung cung cấp cấu trúc trang web, bằng cách sử dụng các phần tử và thẻ, bạn có thể thêm văn bản, hình ảnh, video, biểu mẫu, v.v. Học cơ bản HTML là bước đầu tiên quan trọng trong hành trình phát triển web của bạn và một kỹ năng thiết yếu cho các nhà phát triển phía trước và back-end.

HTML là một trong những khối xây dựng cốt lõi của web, vì nó gói gọn nội dung trên các trang web bạn truy cập. Tuy nhiên, mặc dù có ảnh hưởng rất lớn, rất ít người thực sự nhận thức được cách thức hoạt động của nó.

Vì vậy, để cải thiện kiến ​​thức công nghệ của thế giới, chúng tôi đã hợp tác với nhà phát triển, nhà thiết kế và giáo viên Eric Tirado và tạo ra một khóa học miễn phí trên HTML5.

Nhấp vào đây để đến trang khóa học

Trong suốt khóa học, Eric sẽ đưa bạn từ người mới bắt đầu đến thành thạo HTML trong khi chỉ cho bạn cách xây dựng một trang web. Và phần tốt nhất là: Nó sẽ mất ít hơn một giờ để hoàn thành khóa học!

Bây giờ, hãy để một cái nhìn về cách nó xây dựng.

Nội dung khóa học

Khóa học chứa 14 screencast tương tác. Mỗi diễn viên xử lý một khái niệm cốt lõi của HTML, và hầu hết là từ ba đến sáu phút. Trong một số trong số họ, bạn sẽ được khuyến khích nhảy vào mã và tự mình thử nghiệm, vì điều đó có thể với nền tảng Scrimba.

Bài học số 1: Giới thiệu về web

Nó bắt đầu bằng cách dạy bạn một chút về web nói chung, nhìn vào máy khách, máy chủ và ba ngôn ngữ trình duyệt nói: HTML, CSS và JavaScript.

Điều này cung cấp cho bạn một nền tảng tốt cho các bài học tiếp theo, vì bạn sẽ tốt hơn nên nắm bắt vai trò tổng thể của HTML trên World Wide Web.

Bài học số 2: Tạo tài liệu HTML

Bước tiếp theo là tạo tài liệu HTML đầu tiên của bạn. Bài giảng này sẽ giải thích cách các tệp HTML hoạt động và nó cũng sẽ cung cấp cho bạn một đoạn mồi nhanh trên thanh URL trong trình duyệt.

Bài học số 3: Các yếu tố làm tổ

Nesting là một khái niệm quan trọng trong HTML, do đó, nó sẽ được đề cập trong bài học thứ ba. Nesting về cơ bản có nghĩa là bạn có thể làm tổ vào bên trong nhau. Để làm tổ một phần tử HTML, chỉ cần thêm nó ở giữa các thẻ mở và đóng của phần tử HTML khác.

Bài học số 4: Các yếu tố và tập lệnh đầu

  
  Learning HTML  
    
    
    
    
    
    
    h2 {  
      text-align: center;  
    }  
    
    
    document.getElementById["h2"].innerHTML = "Hello Universe!";  
    

Phần tử đầu là thẻ HTML đầu tiên sau thẻ . Nó có một thùng chứa cho siêu dữ liệu và thường xác định tiêu đề **, ** Bộ ký tự, kiểu, liên kết, tập lệnh và thông tin meta khác.

Vì vậy, trong bài giảng này, bạn sẽ học cách điền vào thẻ meta với một loạt các loại nội dung khác nhau, như bạn có thể thấy trong đoạn trích ở trên.

Bài học #5: Các yếu tố bố trí

HTML5 đã giới thiệu một loạt các yếu tố bố trí làm cho HTML trở nên ngữ nghĩa hơn. Các thẻ mới này bây giờ củng cố ý nghĩa đối với các yếu tố bố cục được sử dụng phổ biến nhất, như

, trong khi trong thời gian qua, chúng ta chỉ có một yếu tố vô nghĩa như
để sử dụng. Trong screencast này, bạn sẽ học được những cái hữu ích và quan trọng nhất.

Bài học số 6: Hình và các yếu tố hình ảnh

Hình ảnh là một phần cốt lõi của hầu hết các trang web. Trong bài giảng này, bạn sẽ học cách thêm hình ảnh vào trang web và cũng là cách thêm chú thích cho chúng.

Bài học số 7: Nhúng video

Bạn có thể nhận thấy rằng các video trên YouTube trên web, phải không? Không chỉ trên youtube.com. Điều đó có thể nhờ một trong các tính năng HTML để nhúng phương tiện vào một trang từ nơi khác trên web. Trong bài học này, chúng tôi bao gồm các phương thức nhúng video từ các trang web như YouTube và cũng trực tiếp từ một tệp video.

Bài học #8: Các mục Navbar và Liệt kê

Trong bài giảng này, bạn sẽ học cách xây dựng thanh điều hướng bằng một danh sách và danh sách không có thứ tự. Điều này liên quan đến cả một thanh điều hướng ngang và dọc, để sử dụng trong tiêu đề và trong thanh bên của trang web của chúng tôi.

Bài học #9: Tiêu đề

Các tiêu đề được tạo bằng thẻ , trong đó dấu * sẽ được thay thế bằng các số từ 1 đến 6. Tầm quan trọng của tiêu đề giảm khi số tăng, nghĩa là

là thứ bạn thường sử dụng cho tiêu đề quan trọng nhất hoặc nhắn tin trên trang của bạn.

Bài học #10: Định dạng đoạn văn và văn bản [Phần 1]

Định dạng văn bản cũng rất quan trọng để biết để xây dựng các trang web và trong bài giảng này, bạn sẽ tìm hiểu những điều cơ bản của nó. Bạn có thể nhận ra rất nhiều khái niệm ở đây từ các bộ xử lý văn bản như từ và trang.

Bài học #11: Định dạng văn bản [Phần 2]

Trong bài học này, bạn sẽ tìm hiểu thêm về định dạng, nhưng với các thẻ ảnh hưởng đến các khối văn bản lớn. Ví dụ về điều này là phần tử và phần tử 0.

Bài học #12: Bảng [Phần 1]

Các bảng có thể hơi phức tạp, nhưng bài giảng này cố gắng giải thích nó đơn giản nhất có thể. Thứ hai, hai bài giảng sẽ được dành riêng cho chủ đề này để bạn hiểu đúng.

Bài học #13: Bảng [Phần 2]

Trong bài học này, bạn sẽ học các yếu tố nâng cao hơn trong các bảng, như 1, 2 và 3. Chúng cho phép bạn kiểm soát các yếu tố bên trong đầu, cơ thể và chân trang riêng biệt.

Bạn cũng sẽ được tiếp xúc với 4, cho phép bạn thêm các kiểu vào các cột cụ thể.

Bài học #14: Liên kết trang và chạm cuối cùng

Trong screencast cuối cùng, chúng tôi sẽ kết thúc tất cả và hoàn thành trang web. Chúng tôi sẽ thêm một liên kết từ điều hướng đến các phần khác nhau trên trang và cũng giới thiệu một trang khác để bạn hiểu cách liên kết giữa các trang hoạt động.

Đến thời điểm này, bạn nên có một sự hiểu biết vững chắc về HTML và các thẻ quan trọng nhất của ngôn ngữ.

Lưu ý: Eric cũng sẽ ra mắt một khóa học tiếp theo vào tháng Tư, điều này sẽ giải quyết CSS cho người mới bắt đầu. Để lại email của bạn ở đây nếu bạn muốn truy cập sớm.

Định dạng scrimba

Cuối cùng, hãy để Lừa cũng có một cái nhìn về công nghệ đằng sau khóa học, vì nó khá khó khăn. Khóa học được xây dựng bằng Scrimba, một công cụ Screencast mã hóa tương tác. Scrimba trông giống như các video bình thường, nhưng chúng tương tác hoàn toàn. Bạn có thể chỉnh sửa mã bên trong các diễn viên!

Ở đây, một GIF giải thích khái niệm:

Tạm dừng Screencast → Chỉnh sửa mã → Chạy nó! → Xem những thay đổi của bạn

Điều này thật tuyệt vời khi bạn cảm thấy bạn cần thử nghiệm mã để hiểu đúng hoặc khi bạn chỉ muốn sao chép một đoạn mã.

Bạn đang chờ đợi điều gì? Đi qua trang khóa học và bắt đầu ngay hôm nay!

Cảm ơn vì đã đọc! Tên tôi là mỗi Borgen, tôi là người đồng sáng lập Scrimba-cách dễ nhất để học viết mã. Bạn nên kiểm tra Bootcamp thiết kế web đáp ứng của chúng tôi nếu muốn học cách xây dựng trang web hiện đại ở cấp độ chuyên nghiệp.

Nhấn vào đây để đến Bootcamp nâng cao.

Học mã miễn phí. Chương trình giảng dạy nguồn mở của Freecodecamp đã giúp hơn 40.000 người có được việc làm với tư cách là nhà phát triển. Bắt đầu

Bài Viết Liên Quan

Chủ Đề