Trong HTML, xác định các quy tắc kiểu dựa trên thuộc tính lớp của các phần tử. Các phần tử có lớp đó sẽ được định dạng theo quy tắc đã xác định. Đây được gọi là bộ chọn lớp. Để chọn các phần tử với một lớp cụ thể, bạn cần viết một ký tự dấu chấm (.), Theo sau là tên của lớp, ví dụ:.black
.black { color: #000000; }
Hiển thị nội dung bằng màu đen cho mọi phần tử có thuộc tính lớp được đặt thành màu đen trong tài liệu của chúng tôi. Ví dụ:chỉ hiển thị nội dung bằng màu đen cho các phần tử
có thuộc tính lớp được đặt thành màu đen. h3.black {
color: #000000;
}
Một ví dụ khác có thể bao gồm việc tạo kiểu cho thẻ
. Thông qua phần sau, hãy tạo kiểu cho tất cả các phần tử
bằng class ="device"
Ví dụ
<!DOCTYPE html> <html> <head> <style> p.device { background: #000000; color: #fffffF; } </style> </head> <body> <p>This is demo text</p> <p class="device">Information about devices.</p> <p>This is demo text</p> </body> </html>
Việc tạo kiểu của thẻ
có thể được thực hiện với nhiều lớp, tức là thiết bị và phụ kiện tại đây
Ví dụ
<!DOCTYPE html> <html> <head> <style> p.device { background: #000000; color: #fffffF; } p.accessories { text-align: center; } </style> </head> <body> <p class="device accessories">DEVICE DETAILS</p> <p class="device">Information about devices.</p> </body> </html>