Trong thế giới phát triển web ngày nay, HTML và CSS là hai khái niệm quan trọng không thể thiếu. Để bắt đầu hành trình của mình trong việc học thiết kế web, bạn cần hiểu rõ về hai ngôn ngữ này và cách chúng liên quan đến nhau. Bài viết này sẽ giúp bạn tìm hiểu về HTML và CSS và cung cấp tài liệu giáo trình hữu ích để bắt đầu học từ A-Z.
HTML là gì?
HTML, viết tắt của HyperText Markup Language, là ngôn ngữ máy tính được tạo ra để tạo ra các trang web. Ngôn ngữ này tương đối dễ học và đơn giản, cho phép mọi người tiếp cận và thực hiện những việc cơ bản trên web. HTML liên tục được cải tiến và phát triển để đáp ứng nhu cầu ngày càng tăng của người dùng Internet dưới sự chỉ đạo của W3C – tổ chức có trách nhiệm thiết kế và duy trì ngôn ngữ này.
Bạn đang xem: HTML, CSS: Tìm hiểu ngôn ngữ thiết kế web căn bản từ A-Z
HTML định nghĩa thành phần cơ bản của trang web. Ba khái niệm quan trọng của HTML là “siêu văn bản”, “đánh dấu”, và “ngôn ngữ”. Siêu văn bản cho phép bạn di chuyển trên web bằng cách nhấp vào những liên kết đặc biệt. Đánh dấu xác định cách văn bản hiển thị và HTML là ngôn ngữ chứa các từ mã và cú pháp giống như bất kỳ ngôn ngữ nào khác.
HTML bao gồm các thẻ HTML, được nhập vào tệp văn bản, để tạo nên trang web. Tệp văn bản này sau đó được lưu dưới dạng tệp HTML và được hiển thị bằng trình duyệt web như Internet Explorer hoặc Netscape Navigator. Trình duyệt đọc tệp và dịch văn bản thành dạng có thể nhìn thấy, hiển thị trang web theo thiết kế của lập trình viên. Viết HTML đòi hỏi sử dụng các thẻ chính xác để tạo nên giao diện mong muốn. Bạn có thể sử dụng các công cụ từ trình soạn thảo văn bản đơn giản đến trình soạn thảo đồ họa phức tạp để tạo ra các trang web HTML.
Xem thêm : Ngành Điện công nghiệp là gì? Ra trường làm công việc gì?
Các thành phần chính của HTML bao gồm:
- Thẻ mở: định nghĩa nơi phần tử bắt đầu hoặc có hiệu lực.
- Thẻ đóng: định nghĩa nơi phần tử kết thúc. Lưu ý là không được bỏ sót thẻ đóng.
- Nội dung: là phần văn bản hoặc nội dung của phần tử.
- Phần tử: bao gồm thẻ mở, thẻ đóng và nội dung của phần tử.
CSS là gì? Và CSS liên quan đến HTML như thế nào?
Cascading Style Sheets (CSS) là một ngôn ngữ để chỉ định cách trình bày tài liệu trên web. Trình bày tài liệu có nghĩa là biến đổi nó thành một hình thức có thể hiển thị và sử dụng cho người dùng. Các trình duyệt như Firefox, Chrome hoặc Internet Explorer được thiết kế để trình bày tài liệu một cách trực quan, ví dụ như trên màn hình máy tính, máy chiếu hoặc máy in.
CSS, viết tắt của Cascading Style Sheets, tập trung vào việc hiển thị. Trong khi HTML được sử dụng để xác định cấu trúc của một trang web và cho phép nhúng hình ảnh, video và nhiều phương tiện khác, thì CSS chỉ định về bố cục, màu sắc và phông chữ… vv… của trang web. Có thể nói, HTML là nền tảng của ngôi nhà và CSS là phong cách nội thất.
CSS áp dụng phong cách cho trang web bằng cách tương tác với các yếu tố HTML. Các yếu tố là các thành phần HTML riêng lẻ của một trang web, ví dụ như đoạn văn bản. Ví dụ, nếu bạn muốn đoạn văn bản xuất hiện màu hồng và đậm trên trình duyệt web, bạn có thể sử dụng đoạn mã CSS như sau:
p { color: pink; font-weight: bold; }
Trong đoạn mã này, “p” là bộ chọn của CSS, xác định phần tử HTML nào mà kiểu CSS sẽ áp dụng. Trong CSS, bộ chọn được ghi bên trái của dấu ngoặc nhọn đầu tiên. Những thông tin ở giữa dấu ngoặc nhọn được gọi là khai báo, chứa các thuộc tính và giá trị áp dụng cho bộ chọn đó. Thuộc tính là những yếu tố như kích thước phông chữ, màu sắc và lề, trong khi giá trị là những cài đặt cho các thuộc tính đó. Trong ví dụ trên, cả màu sắc và phông chữ in đậm là thuộc tính, và màu hồng và đậm là giá trị. Toàn bộ khối mã sẽ như sau:
{ color: pink; font-weight: bold; }
Nguyên tắc cơ bản này có thể được áp dụng để thay đổi kích thước phông chữ, màu nền, thụt lề và nhiều hơn nữa. Ví dụ:
body { background-color: lightblue; }
sẽ làm cho nền trang web của bạn có màu xanh sáng.
p { font-size: 20px; color: red; }
sẽ tạo ra một đoạn văn bản với cỡ chữ 20pt và màu đỏ.
Tài liệu giáo trình học thiết kế web cơ bản từ A-Z
Để bắt đầu học thiết kế web, bạn cần một tài liệu giáo trình cụ thể và chi tiết từ cơ bản đến nâng cao. Đây là một tài liệu học thiết kế web cơ bản từ A-Z để giúp bạn điều hướng trong hành trình của mình:
Tài liệu này cung cấp kiến thức và kỹ năng căn bản để thiết kế và phát triển trang web. Nó bao gồm các khái niệm về HTML, CSS, và các công nghệ khác liên quan đến việc xây dựng trang web. Bạn sẽ tìm thấy các hướng dẫn chi tiết, ví dụ thực tế và các tài liệu tham khảo hữu ích để nắm bắt được tất cả các khía cạnh quan trọng của việc thiết kế web.
Nguồn: https://laptrinhc.edu.vn
Danh mục: Khám phá