Tóm Tắt
Dẫn nhập
Ở phần giới thiệu khóa học, Kteam đã giới thiệu đến các bạn TỔNG QUAN KHÓA HỌC và project Website Landing Page chúng ta sẽ thực hành trong khóa học này.
Trong bài này chúng ta đi vào phần đầu tiên là Tổng quan về HTML và các cú pháp cơ bản.
Nội dung
Trong bài hướng dẫn này, chúng ta sẽ cùng tìm hiểu các vấn đề:
Bạn đang đọc: Tổng quan về HTML và các cú pháp cơ bản | How Kteam
- Giới thiệu về HTML
- Cài đặt & sử dụng phần mềm Visual Studio code
- Cách tạo & cấu trúc cơ bản của một file HTML
Lưu ý: Bài viết nhằm tóm tắt nội dung thực hiện project & giúp bạn nắm bắt các phần được hướng dẫn một cách đơn giản nhất. Tuy nhiên, hãy theo dõi video để học hỏi các kiến thức và kỹ thuật chi tiết nhất từ tác giả.
Giới thiệu về HTML
HTML viết tắt Hyper Text Markup Language (hay Siêu văn bản) được thiết kế ra để tạo nên các trang web
Cùng với CSS và JavaScript tạo nên bộ 3 nền tảng cho World Wide Web
Cú pháp html được cấu tạo bởi các thẻ có đóng mở, như cặp thẻ
, thẻ
, …và những thẻ không cần thẻ đóng như thẻ thẻ
Việc code HTML được thực hiện thông qua nhiều công cụ trong đó có các editor nổi tiếng như SUBLIME TEXT, bracket, nodepad ++ và trong loạt bài hướng dẫn này mình sẽ hướng dẫn các bạn sử dụng Visual studio code, một editor khá mới nhưng vô cùng mạnh mẽ, tiện lợi.
Cài đặt và sử dụng phần mềm Visual Studio Code
Mở trang chủ của visual studio code ra và chọn phiên bản tương thích ( window, macOS, linux ), tải về và setup thông thường
Mở giao diện visual studio code, tạo file index.html để bắt đầu code
Cách tạo & cấu trúc cơ bản của một file HTML
Comment
Comment trong HTML hay bất kì ngôn ngữ lập trình nào đều rất quan trọng, giúp code dễ hiểu, dễ bảo trì và cập nhật
Cú pháp Comment trong HTML
Ví dụ:
Cấu trúc của file HTML cơ bản
Howkteam.com
Cấu trúc chung của html gồm có thẻ
dùng để xác định rằng code bạn đang dùng là html
- Cặp thẻ đóng mở
chứa toàn bộ các dòng lệnh html bên trong (sau này còn là code của Javascript và CSS khi chèn vào)
- Tiếp đến là 2 cặp thẻ
chứa thông tin của webpage và đặc trưng bởi thẻ
, mà mặc định sẽ không được hiển thịtrên web - Thẻ
chứa toàn bộ nội dung html sẽ hiển thị lên trên trang web của chúng ta.
Các thẻ thường gặp trong HTML
Chúng ta tiếp tục với các thẻ thường gặp trong html
Thẻ tiêu đề
Nội dung tiêu đề
Tương tự với các thẻ h2,h3,h4,h5,h6 với cấp độ tiêu đề giảm dần
Ví dụ:
Howkteam.com
Kteam
Free Education
Share To Be Better
Khóa học lập trình Front End
Project Landing Page
Thẻ định dạng đoạn văn bản
Nội dung đoạn văn bản chứa bên trong
Ví dụ:
Với mong ước mang đến kỹ năng và kiến thức chất lượng, không lấy phí cho mọi người, với tận tâm phá bỏ rào cản kiến thức và kỹ năng từ việc giáo dục thu phí. Chúng tôi - Kteam đã lập nên trang website này để quốc tế phẳng hơn. Bất cứ ai có mong ước tìm hiểu và khám phá quốc tế. Phá bỏ mọi thứ ngăn cản sự tăng trưởng tất yếu vững chắc của xã hội đều là Kter ( Thành viên của Kteam ). GIÁO DỤC LÀ MIỄN PHÍ !
Các thẻ mà tạo ra hiệu ứng với chữ
Ngoài các thẻ trên, HTML còn có các thẻ tạo hiệu ứng với chữ, đoạn văn bản như , , , ,
>,….
Và một số thẻ khác như
để cách xuống dòng,
để kẻ đường ngăn cách ngang,…
Cùng tìm hiểu thêm ví dụ bên dưới để hiểu hơn về cách sử dụng những thẻ trên
Ví dụ:
HOWKTEAM BLOG
HOWKTEAM
Hello Kter
HOWKTEAM
HOWKTEAM
HOWKTEAM
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Rem debitis eos dolorem itaque tempore libero ipsa quibusdam fuga, vel,
molestiae maxime harum consequatur architecto repellat dolores cupiditate iure nisi fugiat?
Lorem ipsum, dolor sit amet consect
etur adipisicing elit. Nulla, culpa.
Ta được tác dụng
Thẻ hình ảnh & liên kết
Thẻ thẻ chứa nội dung là file ảnh có các thuộc tính:
- src=”” (dùng làm đường dẫn/địa chỉ của ảnh )
- alt=”” (văn bản thay thế hiển thị khi ảnh không tải lên được trên trang web )
=”đường dẫn hình ảnh” alt=”nội dung thay thế”>
Thẻ dẫn đến các trang web khác.
=”đường dẫn/ liên kết”> nội dung gắn đường dẫn
Thẻ
là nơi chứa các thẻ như input, textarea, select để làm mẫu điền các thông tin trong trang web
Thẻ là chỗ điền thông tin theo dạng chữ, hoặc dạng email, chúng ta sẽ nói kĩ về input ở các bài sau
Thẻ điền thông tin dạng văn bản
Ví dụ:
Link dan den HOWKTEAM
Ta được tác dụng của đoạn code trên hiền thị lên trang web như sau
Kết luận
Ở bài hướng dẫn này tất cả chúng ta đã có được những khái niệm khởi đầu về html, cách tạo file html cũng như những cú pháp cơ bản .
Ở bài học sau, chúng ta sẽ cùng tìm hiểu về CSS – CÁCH CHÈN CSS VÀO HTML và các cú pháp cơ bản của CSS
Cảm ơn bạn đã theo dõi bài viết. Hãy để lại bình luận hoặc góp ý của mình để phát triển bài viết tốt hơn. Đừng quyên “Luyện tập – Thử thách – Không ngại khó”.
Thảo luận
Nếu bạn có bất kể khó khăn vất vả hay vướng mắc gì về khóa học, đừng ngần ngại đặt câu hỏi trong phần bên dưới hoặc trong mục HỎI và ĐÁP trên thư viện Howkteam. com để nhận được sự tương hỗ từ hội đồng .
Source: https://final-blade.com
Category: Kiến thức Internet