Lý thuyết Tin 12 Chân trời sáng tạo Bài F7: Giới thiệu CSS

Giảm giá 50% sách VietJack đánh giá năng lực các trường trên Shopee Mall

Với tóm tắt lý thuyết Tin học 12 Bài F7: Giới thiệu CSS sách Chân trời sáng tạo hay nhất, ngắn gọn sẽ giúp học sinh lớp 12 nắm vững kiến thức trọng tâm, ôn luyện để học tốt môn Tin 12.

Lý thuyết Tin 12 Chân trời sáng tạo Bài F7: Giới thiệu CSS

Quảng cáo

1. Khái niệm CSS:

- CSS (Cascading Style Sheets) là ngôn ngữ dùng để định kiểu các phần tử HTML trên trang web.

- CSS hỗ trợ định kiểu cho nhiều phần tử HTML trên một hoặc nhiều trang web cùng lúc, bao gồm việc mô tả bố cục, màu sắc, phông chữ, và các khía cạnh trực quan khác.

- CSS kiểm soát vị trí, kích thước, khoảng trống của các thành phần, giúp đáp ứng các yêu cầu phức tạp về bố cục mà HTML không thể thực hiện.

- CSS có thể tạo các hiệu ứng như đổ bóng, màu chuyển sắc, hiệu ứng hoạt hình và chuyển cảnh sinh động.

- HTML tập trung vào việc định hình nội dung và cấu trúc (tiêu đề, đề mục, đoạn văn, hình ảnh, video), trong khi CSS tập trung vào việc trình bày bố cục và hình thức của các phần tử trong trang web.

Lợi ích của CSS trong việc xây dựng trang web:

- Tạo ra thiết kế đẹp mắt và dễ sử dụng.

- Cải thiện khả năng tùy chỉnh và quản lý bố cục trang web.

Quảng cáo

- Giúp trang web đáp ứng và tương thích với nhiều thiết bị và kích thước màn hình khác nhau.

- Tăng hiệu suất tải trang web và giảm độ phức tạp của mã HTML.

a) Linh hoạt về bố cục:

- CSS có khả năng đáp ứng các yêu cầu phức tạp về bố cục, hình thức và hiệu ứng của trang web.

- Giúp thay đổi bố cục để phù hợp với các kích thước màn hình khác nhau của máy tính, điện thoại thông minh, v.v.

b) Nhất quán về hình thức:

- Đảm bảo sự nhất quán về hình thức cho toàn bộ các trang web trong cùng một website.

- Ví dụ: Định kiểu chung cho phần tử <h1> sẽ áp dụng cho tất cả các phần tử <h1> trên các trang, tạo sự đồng nhất và chuyên nghiệp.

c) Dễ bảo trì và nâng cấp:

- CSS giúp tách biệt nội dung (thẻ HTML) và hình thức (CSS), làm cho việc bảo trì và nâng cấp dễ dàng hơn.

Quảng cáo

- Khi cần thay đổi hình thức của trang web, chỉ cần điều chỉnh mã CSS mà không ảnh hưởng đến nội dung.

d) Có thể tái sử dụng:

- Định kiểu bằng CSS cho phép tái sử dụng các thành phần trên cùng một trang web hoặc các trang web khác nhau.

2. Các cách bổ sung mã lệnh CSS trong trang web:

Có ba cách thường được sử dụng để bổ sung mã lệnh CSS vào trang web.

Cách 1. Chèn trực tiếp mã lệnh CSS vào các thẻ mở của phần tử HTML thông qua thuộc ính style theo cú pháp:

tên_thẻ_HTML style="thuộc_tỉnh CSS: giá trị; thuộc tỉnh CSS: giá trị; "

Cách này giúp định kiểu nhanh và trực tiếp cho một phần tử HTML cụ thể. Tuy nhiên, cách này có nhiều hạn chế, chẳng hạn như khó khăn bảo trì hoặc không thể tái sử dụng mã lệnh CSS.

Cách 2. Chèn cặp thẻ <style></style> kèm mã lệnh CSS vào giữa cặp thẻ <head></head> của tệp portfolio.html. Phần mã lệnh CSS trong thẻ <style> được viết theo cú pháp:

Quảng cáo

Cách 3. Tạo tệp mã lệnh CSS riêng biệt và chèn vào trang web một liên kết đến tệp CSS bằng thẻ <link> đặt vào giữa cặp thẻ <head></head). Thẻ <link> được viết theo cú pháp:

Cách này cũng đem lại kết quả tương tự như cách 2. Một số ưu điểm của cách này là tách rời các thành phần của một trang web, hỗ trợ khả năng làm việc cộng tác, khả năng bảo trì và tái sử dụng mã lệnh.

Xem thêm tóm tắt lý thuyết Tin học lớp 12 Chân trời sáng tạo hay khác:

Xem thêm các tài liệu học tốt lớp 12 hay khác:

Tài liệu cho giáo viên: Giáo án, powerpoint, đề thi giữa kì cuối kì, đánh giá năng lực, thi thử THPT, HSG, chuyên đề, bài tập cuối tuần..... độc quyền VietJack, giá hợp lí

Sách VietJack thi THPT quốc gia 2025 cho học sinh 2k7:

ĐỀ THI, GIÁO ÁN, GÓI THI ONLINE DÀNH CHO GIÁO VIÊN VÀ PHỤ HUYNH LỚP 12

Bộ giáo án, đề thi, bài giảng powerpoint, khóa học dành cho các thầy cô và học sinh lớp 12, đẩy đủ các bộ sách cánh diều, kết nối tri thức, chân trời sáng tạo tại https://tailieugiaovien.com.vn/ . Hỗ trợ zalo VietJack Official