Sử dụng nth-child trong css

Bạn có thể sử dụng even (tương ứng với các phần tử chẵn) và odd (tương ứng với các phần tử lẻ) với nth-child. Ngoài ra, bạn còn có thể sử dụng phép tính toán như sau

1 .gallery:nth-child(4n+4) {
2     margin: 0
3 }

Với phép tính trên, các phần tử thứ 4, 8, 12… sẽ được áp dụng thuộc tính margin = 0. Vậy n là gì? Bạn có thể hiểu n là một số tự nhiên bắt đầu bằng 0 (số nguyên không âm). Như vậy, 4n+4 sẽ được hiểu là 4*n + 4, và phép tính sẽ như sau:

4*0 + 4 = 4 (phần tử thứ 4)
4*1 + 4 = 4 (phần tử thứ 8)
4*2 + 4 = 4 (phần tử thứ 12)

Với ví dụ trên, bạn có thể sử dụng 4n thay cho 4n + 4 (Trường hợp đầu tiên 4*0 sẽ không khớp với phần tử nào)

Advertisements

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Đăng xuất / Thay đổi )

Connecting to %s