18/08/2018, 11:15
Danh sách tất cả các thuộc tính trong CSS
1) Color Properties Thuộc tính Mô tả chức năng color Chỉnh màu chữ cho văn bản opacity Thiết lập "độ trong suốt" của phần tử 2) Background Properties Thuộc tính Mô tả chức năng background Thiết lập nền cho phần tử HTML background-color ...
1) Color Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| color | Chỉnh màu chữ cho văn bản |
| opacity | Thiết lập "độ trong suốt" của phần tử |
2) Background Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| background | Thiết lập nền cho phần tử HTML |
| background-color | Thiết lập "màu nền" của phần tử HTML |
| background-clip | Xác định phạm vi được thiết lập màu nền (hình nền) của phần tử |
| background-image | Thiết lập "hình nền" cho phần tử HTML |
| background-repeat | Thiết lập "sự lặp lại của hình nền" trong phần tử HTML |
| background-position | Thiết lập "vị trí của hình nền" trong phần tử HTML |
| background-origin | Thiết lập phạm vi mà hình nền sẽ bắt đầu được xuất hiện |
| background-size | Thiết lập kích thước của hình nền |
| background-attachment | Thiết lập cách thức mà hình nền sẽ được hiển thị |
| background-blend-mode | Chỉ định chế độ hòa trộn giữa các lớp nền của phần tử HTML |
3) Border Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| border | Thiết lập một đường viền cho phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền. |
| border-style | Thiết lập "kiểu đường viền" của phần tử HTML |
| border-awidth | Thiết lập "độ dày đường viền" của phần tử HTML |
| border-color | Thiết lập "màu đường viền" của phần tử HTML |
| border-radius | Thiết lập độ cong các góc của phần tử HTML |
| border-left | Thiết lập đường viền cạnh bên trái của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền |
| border-left-style | Thiết lập "kiểu đường viền" cạnh bên trái của phần tử HTML |
| border-left-awidth | Thiết lập "độ dày đường viền" cạnh bên trái của phần tử HTML |
| border-left-color | Thiết lập "màu đường viền" cạnh bên trái của phần tử HTML |
| border-right | Thiết lập đường viền cạnh bên phải của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền |
| border-right-style | Thiết lập "kiểu đường viền" cạnh bên phải của phần tử HTML |
| border-right-awidth | Thiết lập "độ dày đường viền" cạnh bên phải của phần tử HTML |
| border-right-color | Thiết lập "màu đường viền" cạnh bên phải của phần tử HTML |
| border-top | Thiết lập đường viền cạnh phía trên của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền |
| border-top-style | Thiết lập "kiểu đường viền" cạnh phía trên của phần tử HTML |
| border-top-awidth | Thiết lập "độ dày đường viền" cạnh phía trên của phần tử HTML |
| border-top-color | Thiết lập "màu đường viền" cạnh phía trên của phần tử HTML |
| border-top-left-radius | Thiết lập độ cong góc "phía trên - bên trái" của phần tử HTML |
| border-top-right-radius | Thiết lập độ cong góc "phía trên - bên phải" của phần tử HTML |
| border-bottom | Thiết lập đường viền cạnh phía dưới của phần tử HTML, bao gồm: kiểu đường viền, độ dày đường viền, màu đường viền |
| border-bottom-style | Thiết lập "kiểu đường viền" cạnh phía dưới của phần tử HTML |
| border-bottom-awidth | Thiết lập "độ dày đường viền" cạnh phía dưới của phần tử HTML |
| border-bottom-color | Thiết lập "màu đường viền" cạnh phía dưới của phần tử HTML |
| border-bottom-left-radius | Thiết lập độ cong góc "phía dưới - bên trái" của phần tử HTML |
| border-bottom-right-radius | Thiết lập độ cong góc "phía dưới - bên phải" của phần tử HTML |
| border-image | Thiết lập một đường viền hình ảnh bao xung quanh phần tử HTML |
| border-image-source | Xác định tập tin hình ảnh mà bạn muốn dùng để làm đường viền hình ảnh cho phần tử |
| border-image-slice | Xác định các "lát cắt" trong tấm hình mà bạn muốn dùng để làm đường viền hình ảnh cho phần tử |
| border-image-repeat | Xác định kiểu lặp lại ở các cạnh của đường viền hình ảnh |
| border-image-awidth | Thiết lập độ dày của đường viền hình ảnh |
| border-image-outset | Đẩy đường viền hình ảnh ra khỏi vị trí bạn đầu của nó |
| box-shadow | Tạo một cái bóng cho phần tử HTML |
4) Basic Box Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| margin | Xác định khoảng cách lề của phần tử HTML |
| margin-top | Xác định khoảng cách "lề phía trên" của phần tử HTML |
| margin-bottom | Xác định khoảng cách "lề phía dưới" của phần tử HTML |
| margin-left | Xác định khoảng cách "lề bên trái" của phần tử HTML |
| margin-right | Xác định khoảng cách "lề bên phải" của phần tử HTML |
| position | |
| top | |
| bottom | |
| left | |
| right | |
| padding | Xác định khoảng cách vùng đệm của phần tử HTML |
| padding-top | Xác định khoảng cách "vùng đệm phía trên" của phần tử HTML |
| padding-bottom | Xác định khoảng cách "vùng đệm phía dưới" của phần tử HTML |
| padding-left | Xác định khoảng cách "vùng đệm bên trái" của phần tử HTML |
| padding-right | Xác định khoảng cách "vùng đệm bên phải" của phần tử HTML |
| awidth | Thiết lập "chiều rộng" cho phần nội dung của phần tử HTML |
| height | Thiết lập "chiều cao" cho phần nội dung của phần tử HTML |
| max-awidth | Thiết lập "chiều rộng tối đa" cho phần nội dung của phần tử HTML |
| max-height | Thiết lập "chiều cao tối đa" cho phần nội dung của phần tử HTML |
| min-awidth | Thiết lập "chiều rộng tối thiểu" cho phần nội dung của phần tử HTML |
| min-height | Thiết lập "chiều cao tối thiểu" cho phần nội dung của phần tử HTML |
| overflow | Tạo thanh scroll cho phần tử HTML |
| overflow-x | Tạo thanh scroll nằm ngang cho phần tử HTML |
| overflow-y | Tạo thanh scroll nằm dọc cho phần tử HTML |
| float | |
| clear | |
| clip | Cắt xén phần tử HTML |
| display | |
| visibility | |
| vertical-align | |
| z-index |
5) Flexible Box Layout
| Thuộc tính | Mô tả chức năng |
|---|---|
| align-content | |
| align-items | |
| align-self | |
| flex | |
| flex-basis | |
| flex-direction | |
| flex-flow | |
| flex-grow | |
| flex-shrink | |
| flex-wrap | |
| justify-content | |
| order |
6) Text Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| letter-spacing | Thiết lập khoảng cách nằm giữa hai ký tự |
| line-height | Thiết lập "chiều cao của mỗi dòng chữ" trong đoạn văn bản |
| text-align | Canh lề theo chiều ngang cho đoạn văn bản |
| text-align-last | Canh lề theo chiều ngang cho dòng chữ cuối cùng của đoạn văn bản |
| text-indent | Thiết lập khoảng cách "thụt đầu dòng" của dòng đầu tiên trong đoạn văn |
| text-transform | Điều chỉnh văn bản sang dạng chữ in hoa hoặc chữ thường |
| white-space | Xác định cách thức xử lý các dấu khoảng trắng & xuống dòng trong phần tử |
| word-spacing | Thiết lập khoảng cách nằm giữa hai từ |
| word-wrap | Xác định việc có "ngắt các ký tự của một từ xuống dòng" trong trường hợp từ đó bị tràn ra khỏi phần tử hay không |
| word-break | Xác định cách thức phá vỡ một từ. (hay nói cách khác là cách thức ngắt ký tự của một từ xuống dòng) |
7) Text Decoration Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| text-decoration-line | Thiết lập một đường trang trí cho văn bản |
| text-decoration-color | Xác định "màu" của đường trang trí cho văn bản |
| text-decoration-style | Xác định "kiểu" của đường trang trí cho văn bản |
| text-decoration | Thiết lập một đường trang trí cho văn bản, bao gồm:
|
| text-shadow | Tạo một cái bóng cho văn bản |
8) Font Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| @font-face | |
| font | |
| font-family | Thiết lập "phông chữ" của văn bản |
| font-size | Thiết lập "kích cỡ chữ" của văn bản |
| font-style | Thiết lập việc văn bản có được "in nghiêng" hay không |
| font-variant | Thiết lập việc có chuyển các ký tự in thường trong văn bản sang dạng ký tự in hoa hay không |
| font-weight | Thiết lập việc văn bản có được "in đậm" hay không |
9) Table Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| border-collapse | Thiết lập việc đường viền của bảng & đường viền của các ô bên trong bảng có được gộp lại thành một hay không |
| border-spacing | Thiết lập khoảng cách từ đường viền của ô đến đường viền của các ô lân cận |
| caption-side | Xác định vị trí tiêu đề của bảng |
| empty-cells | Xác định việc hiện hay ẩn đường viền và nền của những ô mà nội dung bên trong nó là rỗng |
| table-layout | Xác định việc chiều rộng của ô có bị phụ thuộc vào chiều rộng phần nội dung của nó hay không |
10) Lists and Counters Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| list-style | Thiết lập chỉ mục của các danh mục trong danh sách |
| list-style-type | Xác định "kiểu chỉ mục" của các danh mục trong danh sách |
| list-style-position | Xác định chỉ mục của các danh mục trong danh sách sẽ nằm bên trong phần tử <li> hay nằm bên ngoài phần tử <li> |
| list-style-image | Sử dụng hình ảnh để làm chỉ mục cho các danh mục trong danh sách |
11) Animation Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| @keyframes | |
| animation | |
| animation-delay | |
| animation-direction | |
| animation-duration | |
| animation-fill-mode | |
| animation-iteration-count | |
| animation-name | |
| animation-play-state | |
| animation-timing-function |
12) Transitions Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| transition | |
| transition-property | |
| transition-duration | |
| transition-timing-function | |
| transition-delay |
13) Basic User Interface Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| box-sizing | |
| content | |
| cursor | |
| ime-mode | |
| outline | |
| outline-color | |
| outline-offset | |
| outline-style | |
| outline-awidth | |
| resize | |
| text-overflow |
14) Multi-column Layout Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| column-count | |
| column-fill | |
| column-gap | |
| column-rule | |
| column-rule-color | |
| column-rule-style | |
| column-rule-awidth | |
| column-span | |
| column-awidth | |
| columns |
15) Paged Media
| Thuộc tính | Mô tả chức năng |
|---|---|
| page-break-after | |
| page-break-before | |
| page-break-inside |
16) Generated Content for Paged Media
| Thuộc tính | Mô tả chức năng |
|---|---|
| quotes |
17) Filter Effects Properties
| Thuộc tính | Mô tả chức năng |
|---|---|
| filter |
