Trong CSS, thuộc tính position được sử dụng để kiểm soát vị trí của một phần tử trong phần tử chứa nó. Có một số giá trị bạn có thể sử dụng cho thuộc tính position , mỗi giá trị ảnh hưởng đến vị trí của phần tử theo những cách khác nhau. Dưới đây là các giá trị chính:

Tĩnh (mặc định):
- Các phần tử được định vị theo luồng thông thường của tài liệu.
- Đây là giá trị mặc định và bạn không cần chỉ định rõ ràng.
```
 css
 .example {
  position: static;
}
```
Liên quan đến:
- Các phần tử được định vị tương ứng với vị trí bình thường của chúng trong luồng tài liệu.
- Nếu bạn di chuyển một phần tử có vị trí tương đối, nó sẽ bị lệch khỏi vị trí bình thường.
```
 css
 .example {
  position: relative;
  top: 10px; /* Moves the element 10 pixels down from its normal position */
  left: 20px; /* Moves the element 20 pixels to the right from its normal position */
}
```
Tuyệt đối:
- Các phần tử được loại bỏ khỏi luồng tài liệu thông thường và được định vị tương ứng với vị trí tổ tiên gần nhất.
- Nếu không có tổ tiên được định vị, nó được định vị tương ứng với khối chứa ban đầu (thường là phần tử <html> ).
```
 css
 .example {
  position: absolute;
  top: 30px;
  left: 40px;
}
```
Đã sửa:
- Các phần tử được xóa khỏi luồng tài liệu thông thường và được định vị tương ứng với cửa sổ trình duyệt.
- Phần tử vẫn cố định ngay cả khi cuộn trang.
```
 css
 .example {
  position: fixed;
  top: 50px;
  right: 10px;
}
```
Dính:
- Các phần tử được định vị dựa trên vị trí cuộn của người dùng.
- Đó là sự kết hợp giữa định vị tương đối và cố định. Phần tử được coi là vị trí tương đối cho đến khi nó đi qua một điểm được chỉ định, sau đó nó được coi là vị trí cố định.
```
 css
 .example {
  position: sticky;
  top: 0;
}
```

Đây là những khái niệm cơ bản về thuộc tính position trong CSS. Bạn có thể sử dụng các giá trị này để tạo các bố cục và thành phần thiết kế phức tạp trên trang web của mình. Hãy nhớ rằng hiệu quả của position phụ thuộc vào cách nó tương tác với các thuộc tính bố cục khác và cấu trúc tổng thể của HTML và CSS của bạn.