Lý thuyết Tin 12 Chân trời sáng tạo Bài F7: Giới thiệu CSS
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
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.
- 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.
- 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:
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:
<link rel="stylesheet" type="text/css" href="đường dẫn tập CSS",
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:
Lý thuyết Tin học 12 Bài F8: Một số thuộc tính cơ bản của CSS
Lý thuyết Tin học 12 Bài F9: Một số kĩ thuật định kiểu bằng vùng chọn trong CSS
Lý thuyết Tin học 12 Bài F10: Định kiểu CSS cho siêu liên kết và danh sách
Lý thuyết Tin học 12 Bài F11: Định kiểu CSS cho bảng và phần tử <div>
Sách VietJack thi THPT quốc gia 2024 cho học sinh 2k6:
Săn shopee giá ưu đãi :
- Sổ lò xo Art of Nature Thiên Long màu xinh xỉu
- Biti's ra mẫu mới xinh lắm
- Tsubaki 199k/3 chai
- L'Oreal mua 1 tặng 3
- Soạn văn 12 (hay nhất) - CTST
- Soạn văn 12 (ngắn nhất) - CTST
- Giải sgk Toán 12 - CTST
- Giải Tiếng Anh 12 Global Success
- Giải sgk Tiếng Anh 12 Smart World
- Giải sgk Tiếng Anh 12 Friends Global
- Giải sgk Vật Lí 12 - CTST
- Giải sgk Hóa học 12 - CTST
- Giải sgk Sinh học 12 - CTST
- Giải sgk Lịch Sử 12 - CTST
- Giải sgk Địa Lí 12 - CTST
- Giải sgk Giáo dục KTPL 12 - CTST
- Giải sgk Tin học 12 - CTST
- Giải sgk Hoạt động trải nghiệm 12 - CTST
- Giải sgk Âm nhạc 12 - CTST