Kiến thức cơ bản về Sass - bài 8 Toán tử - Operators
Lượt xem: 3494
Toán tử - Operators
Làm toán trong CSS của bạn rất hữu ích. Sass có một số toán tử toán học tiêu chuẩn như +, -, *, / và%.
Trong ví dụ của chúng tôi, chúng tôi sẽ thực hiện một số phép toán đơn giản để tính chiều rộng cho một aside & article;
Cú pháp SASS
.container
width: 100%
article[role="main"]
float: left
width: 600px / 960px * 100%
aside[role="complementary"]
float: right
width: 300px / 960px * 100%
Cú pháp SCSS
.container {
width: 100%;
}
article[role="main"] {
float: left;
width: 600px / 960px * 100%;
}
aside[role="complementary"] {
float: right;
width: 300px / 960px * 100%;
}
Đầu ra CSS
.container {
width: 100%;
}
article[role="main"] {
float: left;
width: 62.5%;
}
aside[role="complementary"] {
float: right;
width: 31.25%;
}