Biến Sass trong biến ghi đè kiểu bảng in trong biểu định kiểu "tất cả"

Question

Tôi sử dụng phiên bản SASS/Compass mới nhất để phát triển CSS. Tôi đã tuyên bố một số biến Sass vào đầu của "phương tiện truyền thông = tất cả" stylesheet như thế này:

$var1: red; 
$var2: blue; 
$var3: black; 
$var4: green; 

Sau đó trong tập tin SCSS này tôi nhập một kiểu in (@import 'print.scss';) trông như thế này:

@media print { 
    $var1: black; 
    $var2: black; 
    $var4:black; 
} 

tôi nghĩ, rằng các biến trong stylesheet in đè "bình thường" vars chỉ nếu Browser là trong "chế độ in". Nhưng các biến sẽ ghi đè luôn là các vars "bình thường" được khai báo trước đó.

Tôi hơi bối rối và đánh giá cao bất kỳ trợ giúp nào.

Cảm ơn!

Answer 1

Theo this câu hỏi, về cơ bản không thể có trong biểu mẫu hiện tại của bạn. Nếu bạn muốn đạt được điều này, bạn sẽ phải nhập khẩu mỗi phong cách mà làm cho sử dụng $varX của bạn, như:

$blue: blue; 

.test{ 
    color: $blue; 
} 

@media print { 
    $blue: pink; 
    .test{ 
     color: $blue; 
    } 
} 

đầu ra:

.test{color:blue}@media print{.test{color:pink}} 

Nó không phải là giải pháp lý tưởng (bạn sẽ nhận được rất nhiều mã lặp lại), nhưng tiếc là tất cả những gì bạn có thể làm do cách CSS hoạt động.

Đây có thể là một giải pháp tốt hơn một chút:

$blue: blue; 
$print_blue: pink; 

.test{ 
    color: $blue; 
    text-align: right; 
    @media print { 
     color: $print_blue; 
    } 
} 

đầu ra:

.test{color:blue;text-align:right}@media print{.test{color:pink}}