Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất.
Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi.
1- CSS Selector là gì?
CSS Selector được sử dụng để tìm kiếm [Hoặc lựa chọn] các phần tử trong tài liệu HTML để áp dụng kiểu dáng [style] cho chúng.
Ví dụ đơn giản:
/** Select all elements with class contains abc */
.abc
/** Select element with ID = abc */
#abc
CSS Selectors có thể được chia làm 3 loại sau:
Basic Selectors
Các Selector cơ bản giúp bạn lựa chọn các phần tử dựa trên Name, ID, Class hoặc Attribute của nó.
Các Selector cơ bản sẽ được đề cập trong bài viết này.
Combining selectors
Lựa chọn các phần tử dựa trên mối quan hệ giữa chúng.
Combinator | Syntax | Example |
Descendant combinator | A B
| div span div .item |
Child combinator | A > B
| ul > li |
General sibling combinator | A ~ B
| p ~ span |
Adjacent sibling combinator | A + B
| h2 + p |
Column combinator | A || B
| col || td
|
Pseudo selectors
Pseudo | Syntax | Example |
Pseudo classes | A:B
| a:visited |
Pseudo elements | A::B
| p::first-line |
- TODO Link?
2- Universal selector
Universal selector [Bộ lựa chọn phổ quát]: Lựa chọn tất cả các phần tử hoặc tất cả các phần tử của một namespace [không gian tên].
Cú pháp:
Selector | Mô tả |
* | Lựa chọn tất cả các phần tử. |
*|* | Lựa chọn tất cả các phần tử. |
ns|* | Lựa chọn tất cả các phần tử trong không gian tên ns. |
|* | Lựa chọn tất cả các phần tử không được khai báo không gian tên. |
Ví dụ lựa chọn tất cả các phần tử và thiết lập viền mầu xanh cho nó.
universal-selector-example1.html
Universal Selector: *
* {
border: 1px solid green;
margin: 5px;
}
I am H1 element
I am div element
I am P element