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

html - 第 nth-of-type 表现得像第 nth-child

In lại Tác giả: Vũ trụ không gian Thời gian cập nhật: 2023-11-04 14:18:18 31 4
mua khóa gpt4 Nike

Tôi có mã html này:

 






CSS:

  .productWarp .productLine {
màu nền: #DFDDDD;
viền dưới: 1px liền khối #B7B7B7;
phần đệm bên phải: 5px;
}


.productWarp .productLine:nth-of-type(2)
{
màu nền: trắng;
viền dưới: 1px liền khối #B7B7B7;
phần đệm bên phải: 5px;
}

Thao tác này sẽ chọn phần tử con thứ hai của ProductWarp (Dòng sản phẩm đầu tiên) thay vì Dòng sản phẩm thứ hai, do đó, nó hoạt động chính xác giống như bộ chọn con thứ n



//cái này được chọn

//cái này nên được chọn

Có biết chuyện gì đang xảy ra ở đây không?

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

:thứ n-of-type() Nhìn vào loại phần tử, không phải lớp của nó. Trong trường hợp này tất cả các yếu tố của bạn là div gõ, đó là lý do tại sao :thứ n-of-type():nth-child hoạt động theo cách tương tự().

Nếu bạn chỉ có hai .productLine phần tử, hãy sử dụng bộ chọn sau để tạo kiểu cho phần tử thứ hai:

.productWarp .productLine ~ .productLine
{
màu nền: trắng;
viền dưới: 1px liền khối #B7B7B7;
phần đệm bên phải: 5px;
}

Nếu không bạn chỉ cần vượt qua :nth-child() Chỉ mục, trong trường hợp này :con thứ n(4)hoặc ghi đè các kiểu tiếp theo.productLine phần tử, thêm nhiều lần lặp lại nếu cần ~ .productLine Một phần của các quy tắc.

Về html - loại thứ n hoạt động giống như con thứ n, 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/19477373/

31 4 0
không gian vũ trụ
Hồ sơ

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá taxi Didi miễn phí
Phiếu giảm giá taxi Didi
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