Lý thuyết Tin 12 Kết nối tri thức Bài 13: Khái niệm, vai trò của CSS

Với tóm tắt lý thuyết Tin học 12 Bài 13: Khái niệm, vai trò của CSS sách Kết nối tri thức 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.

1. Khái niệm mẫu định dạng:

Trong đoạn mã nguồn ở Hình 13.2, các dòng từ 6 đến 10 là một loại ngôn ngữ đặc biệt dùng để thiết lập các mẫu định dạng cho trang web. Các mẫu định dạng này được gọi là Cascading Style Sheet và viết tắt là CSS.

CSS là định dạng độc lập với chuẩn HTML, được dùng để thiết lập các mẫu định dạng dùng trong trang web.

CSS (Cascading Style Sheets) là định dạng độc lập với chuẩn HTML, dùng để thiết lập các mẫu định dạng cho trang web.

Mẫu định dạng CSS là một công cụ hỗ trợ giúp định dạng nội dung trang web nhanh hơn, thuận tiện hơn bằng cách định nghĩa một lần và sử dụng nhiều lần. CSS sử dụng ngôn ngữ mô tả riêng, độc lập với HTML.

2. Cấu trúc CSS:

Cấu trúc tổng quát của một mẫu định dạng CSS có hai phần: bộ chọn (selector) và vùng mô tả (declaration block). Vùng mô tả bao gồm một hay nhiều quy định có dạng {thuộc tính : giá trị ; }, các quy định được viết cách nhau bởi dấu “;”. Bộ chọn sẽ quy định những thẻ HTML nào được chọn để áp dụng định dạng này.

Cấu trúc CSS có thể ở dạng đơn giản, trong đó vùng mô tả chỉ có một quy định:

bộ chọn {thuộc tính: giá trị;}

hoặc nhiều quy định ở vùng mô tả như sau: bộ chọn {

thuộc tỉnh 1: giá trị 1;

thuộc tỉnh 2: giá trị 2;

thuộc tính n: giá trị n;

Ví dụ 1: Mẫu CSS thiết lập màu chữ đỏ cho bộ chọn là tất cả các thẻ h1.

h1 {color: red;}

Ví dụ 2: Mẫu CSS gồm hai quy định, thụt lề dòng đầu và chữ màu xanh áp dụng cho bộ chọn là tất cả các thẻ p.

p {text-indent: 15px; color: blue;}

Bộ chọn có thể là một thẻ để áp dụng như hai ví dụ trên hoặc đồng thời nhiều thẻ. Cách viết này giúp cho CSS dễ thiết lập và áp dụng.

Ví dụ 3: Mẫu CSS sau thiết lập định dạng chữ đỏ cho đồng thời các thẻ h1, h2, h3, Các thẻ này được viết cách nhau bởi dấu phẩy.

h1, h2, h3 {color: red;}

Có ba cách thiết lập CSS là CSS trong (internal CSS), CSS ngoài (external CSS) và CSS nội tuyến (inline CSS).

a)Cách thiết lập CSS trong:

Cách thiết lập này đưa toàn bộ các mẫu định dạng vào bên trong thẻ