SASS Day 2

Tính năng xếp chồng:

- Scss cho phép viết lồng các thẻ con vào trong thẻ bố. Cho phép tiết kiệm thời gian viết.
- Scss cho phép viết gọn các thuộc tính cùng họ ví dụ họ font ở trên.

Tính năng sử dụng lại code:

- Từ khóa @mixin: Sử dụng tương tự như tạo ra một hàm css. Ví dụ:
@mixin anh_can_trai() {
float: left;
width: 100 px;
margin-right: 20px;
}
- Khi sử dụng, muốn gọi hàm anh_can_trai ta dùng từ khóa: @include trong thẻ cần gọi, ví dụ:
img {
@include anh_can_trai
}
- Sử dụng @mixin có tham số, ví dụ:
@mixin anh_can_trai2($mphai) {
float: left;
width: 100 px;
margin-right: $mphai;
}
- Gọi hàm anh_can_trai2 có tham số:
img {
@include anh_can_trai2(5px)
}

Tính năng viết pseudo class nhanh của SASS:

- Để tạo hover cho h1 trong jumbotron trong css chúng ta phải viết là : .jumbotron h1:hover {...};

tuy nhiên ở đây chúng ta có thể dùng h1 bên trong jumbotron và thay thế h1 bằng dấu & ta được &:hover = h1:hover. Tương tự như vậy đối với các thuộc tính khác ví dụ &:after.

Tính năng tính toán trong SASS: