Để định kiểu riêng cho bảng Lịch sinh hoạt hằng tuần mà không làm ảnh hưởng bảng khác, em khai báo vùng chọn là lớp my-table và các vùng chọn liên quan lớp này. Các bước thực hiện như sau:

1. Trong tập portfoliohtml, chỉ định giá trị my-table cho thuộc tính class của

the

2. Định kiểu đường viên đơn cho bảng.

.my-table {

alfa hcmstrời sáng tạo

border: 1px solid #446995;

}

border-collapse: collapse; width: 100%;

Trong vùng chọn .my-table, thuộc tính border tạo đường viền màu xanh bao quanh bảng, thuộc tính width giúp bảng có độ rộng bằng với độ rộng trang web.

3. Sử dụng thuộc tính padding để định kiểu cho vùng đệm nhằm tăng diện tích hiển thị

của các ô.

.my-table td, th{

}

padding: 10px;

text-align: center;

Khai báo vùng chọn .my-table td, th nhằm định kiểu các thẻ và nằm bên trong các thẻ có chỉ định lớp my-table, cụ thể là thẻ

Định kiểu riêng cho hàng tiêu đề của bảng với nền màu xanh, chữ màu trắng, in đậm.

.my-table th{

background-color: #446995; color: #fff;

font-weight: bold;

}

Ô Định kiểu mẫu nên khác nhau xen kẽ cho các hàng chẵn và lẻ để tăng tính trực quan. Cụ thể, định kiểu nền màu xám cho các hàng chắn.

.my-table tr:nth-child(even) {

background-color: #e5e5e5;

}

6 Tạo hiệu ứng dõi màu nên của hàng thành màu xanh khi người dùng di chuyển con tra chuột đến.

.my-table tr:hover {

background-color: #ceeaff;

}

Nháy đúp chuột vào lập portfoliohtml để kiểm tra kết quả.

Mở khóa để xem toàn bộ nội dung trả lời

(?)

Bạn đã đạt đến giới hạn của mình. Bằng cách Đăng ký tài khoản, bạn có thể xem toàn bộ nội dung trả lời

Cải thiện điểm số của bạn bằng cách đăng ký tài khoản Lazi.
Xem toàn bộ các câu trả lời, chat trực tiếp 1:1 với đội ngũ Gia sư Lazi bằng cách Đăng nhập tài khoản ngay bây giờ

Đăng nhập bằng Google

Đăng nhập bằng Facebook

Tôi đã có tài khoản? Đăng nhập

Trả lời nhanh trong 10 phút và nhận thưởng

Xem chính sách

Bạn hỏi - Lazi trả lời

Bạn muốn biết điều gì?

GỬI CÂU HỎI

Học tập không giới hạn cùng học sinh cả nước và AI, sôi động, tích cực, trải nghiệm