BÀI 10: BỘ CHỌN LỚP, BỘ CHỌN ĐỊNH DANH

I - MỤC TIÊU BÀI HỌC

• Sử dụng được bộ chọn lớp, bộ chọn định danh.

II - KIẾN THỨC CẦN GHI NHỚ

1. BỘ CHỌN LỚP

- Mỗi bộ chọn lớp (class selector) được đặt tên, thường được dùng để khai báo các quy tắc định dạng được áp dụng chung cho nhiều phần tử trong văn bản HTML thay vì phải viết lặp lại các quy tắc này cho từng phần tử.

- Cú pháp khai báo bộ chọn lớp:

Trong đó, Tên_bộ_chọn_lớp do người tạo CSS tự định nghĩa và bắt đầu bằng dấu chấm.

Lưu ý: 

+ Nên hạn chế đặt tên bộ chọn định danh trùng với tên phần tử.

+ Do mục đích định danh nên tên định danh của phần tử thường là duy nhất trong một trang web.

- Để áp dụng bộ chọn lớp có tên “Tên_bộ_chọn lớp” cho phần tử cụ thể của văn bản HTML, cần khai báo giá trị thuộc tính class của phần tử đó là “Tên_bộ_chọn_lớp”.

- Sử dụng bộ chọn lớp còn giúp tuỳ biến các định dạng trình bày cho các nội dung được tạo bởi cùng loại phần tử HTML.

- Cú pháp khai báo bộ chọn lớp sử dụng cho một phần tử:

2. BỘ CHỌN ĐỊNH DANH

- Cú pháp khai báo sử dụng thuộc tính id để gán tên định danh cho phần tử:

id=“Tên_định_danh”

- CSS có thể sử dụng bộ chọn định danh (ID selector) để áp dụng quy tắc định dạng cho một phần tử đã được định danh trong văn bản HTML. 

- Bộ chọn định danh được xác định thông qua Tên_định_danh của phần tử này và được khai báo như sau: