Hướng dẫn only-child css - con một
Show
Định nghĩa và sử dụng
Thành phần con duy nhất không chứa thành phần con khác có thể là: Ghi chú: Màu xanh là màu được chọn. Màu xanh là màu được chọn. Cấu trúc:only-child {
property: value;
}Ví dụHTML viết:
Hiển thị trình duyệt khi chưa có CSS:p tự do duy nhất
p đầu tiên của div p thứ 2 của div
p thứ 3 của div p cuối cùng của div CSS viết:p:only-child{
color: blue;
}Hiển thị trình duyệt khi đã có css:p tự do duy nhất
p đầu tiên của div p thứ 2 của div
p thứ 3 của div p cuối cùng của div CSS viết: Hiển thị trình duyệt khi đã có css:Ta thấy những thành phần được chọn đều là thành phần duy nhất có trong thành phần cha, thành phần cha không chứa thành phần khác ngoài nó. 1) Bộ chọn :only-child trong CSS- Bộ chọn :only-child dùng để chọn tất cả các phần tử là phần tử con duy nhất của cha nó.:only-child dùng để chọn tất cả các phần tử là phần tử con duy nhất của cha nó. 2) Cách sử dụng bộ chọn :only-child trong CSS- Để sử dụng bộ chọn :only-child, ta dùng cú pháp như sau::only-child, ta dùng cú pháp như sau: 3) Một số ví dụ- Chọn tất cả những phần tử bên trong với điều kiện những phần tử đó phải là phần tử con duy nhất của cha nó. Xem ví dụ - Chọn tất cả những phần tử bên trong với điều kiện những phần tử đó phải là phần tử con duy nhất của cha nó. Xem ví dụ - Chọn tất cả những phần tử bên trong với điều kiện những phần tử đó phải là phần tử con duy nhất của cha nó. Xem ví dụ - Chọn tất cả những phần tử bên trong với điều kiện những phần tử đó phải là phần tử con duy nhất của cha nó. - Chọn tất cả các phần tử nằm bên trong những phần tử là phần tử con duy nhất của cha nó.The Try itNote: As originally defined, the selected element had to have a parent. Beginning with Selectors Level 4, this is no longer required.SyntaxExamplesBasic exampleHTMLCSSExamples:only-child {
property: value;
}0Basic example:only-child {
property: value;
}1HTMLCSS
Browser compatibilityBCD tables only load in the browser See also |
