cuốn sách gpt4 ai đã làm

Tại sao nth-of-type/nth-child không hoạt động đối với các phần tử lồng nhau?

In lại Tác giả: Walker 123 Thời gian cập nhật: 28-11-2023 00:47:04 28 4
mua khóa gpt4 Nike

Tôi đang cố gắng thay đổi kiểu của các div lẻ bên trong div. vì lý do nào đó khi loại thứ n (lẻ) Khi ở trong một div khác, nó sẽ ảnh hưởng đến tất cả các div của tôi. Đây là mã của tôi cho các div thông thường và các div lẻ:

.video-entry-tóm tắt {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 10px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
}

.video-entry-tóm tắt:nth-of-type(odd) {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 0px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
nền: #ccc;
}


video 1





video 2





video 3





video 4

vì lý do nào đó,loại thứ n Không hoạt động khi được gói trong div của tôi nhưng hoạt động khi chúng không được gói trong bất kỳ div nào.

Phiên bản hoạt động khi không được gói trong div:

.video-entry-tóm tắt {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 10px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
}

.video-entry-tóm tắt:nth-of-type(odd) {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 0px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
nền: #ccc;
}

video 1



video 2



video 3



video 4

Làm cách nào để tạo mã ban đầu giống như trên?

câu trả lời hay nhất

:thứ n-of-type():nth-child() Tương tự nhau vì tất cả đều phải đến từ cùng một phụ huynh. Nếu bạn cần những giấy gói đó div, vui lòng sử dụng trên các giấy gói này :thứ n-of-type():

div.post:nth-of-type(odd) .video-entry-summary {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 0px;
nổi:trái;
vị trí: tương đối;
tràn:ẩn;
đường viền:1px màu đen đặc;
nền:#ccc;
}

Nếu tất cả anh em đều.bưu kiện,sử dụng:nth-child()nhưng để ngăn chặn :thứ n-of-type() thực sự có nghĩa là Lú lẫn:

.post:nth-child(odd) .video-entry-summary {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 0px;
nổi:trái;
vị trí: tương đối;
tràn:ẩn;
đường viền:1px màu đen đặc;
nền:#ccc;
}

.video-entry-tóm tắt {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 10px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
}

.post:nth-child(odd) .video-entry-summary {
chiều rộng: 214px;
chiều cao: 210px;
lề trái: 0px;
nổi: trái;
vị trí: tương đối;
tràn: ẩn;
đường viền: màu đen đặc 1px;
nền: #ccc;
}


video 1





video 2





video 3





video 4

Về html - tại sao nth-of-type/nth-child không hoạt động đối với các phần tử lồng nhau? , chúng tôi đã tìm thấy một câu hỏi tương tự trên Stack Overflow: https://stackoverflow.com/questions/53463603/

28 4 0
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress