27
4
Tôi đang tìm kiếm một cái gì đó như +stacktextshadow(xanh dương, đỏ, xanh lá cây) Một hỗn hợp như vậy bóng văn bản: 1px 1px 0 xanh lam, 2px 2px 0 đỏ, 3px 3px 0 xanh lục;
Hiện tại đây là những gì tôi có:
Trung tâm cá nhân
Điều phát hành
từ bỏ=stacktextshadow($shadows...)
@for $i từ 1 đến hết chiều dài($shadows)
$shadow1: nối thêm(1px 1px 0, nth($shadows,1))
$shadow2: nối thêm(2px 2px 0, nth($shadows,2))
$shadow3: nối thêm(3px 3px 0, nth($shadows,3))
bóng văn bản: $shadow1, $shadow2, $shadow3
h1
+stacktextshadow(xanh dương, đỏ, xanh lá cây)
Điều này mang lại cho tôi:
h1 {
bóng văn bản: 1px 1px 0 xanh lam, 2px 2px 0 đỏ, 3px 3px 0 xanh lục;
bóng văn bản: 1px 1px 0 xanh lam, 2px 2px 0 đỏ, 3px 3px 0 xanh lục;
bóng văn bản: 1px 1px 0 xanh lam, 2px 2px 0 đỏ, 3px 3px 0 xanh lục }
ba lần. Tôi biết tại sao, bởi vì nó ở trong @vì Chạy ba lần trong vòng lặp bóng văn bản Khai báo tài sản. Tôi muốn nó được thực hiện chỉ một lần. Nhưng khi nào tôi sẽ bóng văn bản Khi đưa ra khỏi vòng lặp for, nó không thể truy cập được $shadow1,$shadow2 Chờ đợi.
Ngoài ra, tôi không muốn lặp lại những điều sau:$shadow($i): nối thêm($i*1px $i*1px 0, nth($shadows,$i) )(Điều này rõ ràng là không hoạt động) để mọi thứ được thực hiện một cách linh hoạt - cho dù tôi chuyển một tham số vào mixin hay 20.
câu trả lời hay nhất
Bạn có thể tạo một biến bên ngoài vòng lặp để "thu thập" các giá trị bóng, sau đó trong bóng văn bản Sử dụng biến này trong thuộc tính. Ví dụ:
=stacktextshadow($shadows...)
$tất cả: ()
@for $i từ 1 đến hết chiều dài($shadows)
$all: nối thêm($all, nối thêm($i*1px $i*1px 0, nth($shadows, $i)), dấu phẩy)
bóng văn bản: $all
h1
+stacktextshadow(xanh dương, đỏ, xanh lá cây)
Đầu ra:
h1 {
bóng văn bản: 1px 1px 0 xanh lam, 2px 2px 0 đỏ, 3px 3px 0 xanh lục }
Về sass - Nhiều giá trị cho một thuộc tính có danh sách đối số biến đổi trong Sass, chúng tôi đã tìm thấy một câu hỏi tương tự trên Stack Overflow: https://stackoverflow.com/questions/29532303/
27
4
0
Tôi thực sự đang cố gắng xây dựng một dự án gulp để thực hiện những việc liên quan đến web như biên dịch sass, thu nhỏ css, javascript xấu, v.v. Nhưng tôi thực sự gặp khó khăn khi sử dụng sass. Đây là ví dụ mã của tôi: gulp.
Để đơn giản hóa việc mô tả kiểu, các trình duyệt đã thiết kế CSS dưới dạng DSL (Ngôn ngữ dành riêng cho miền). CSS viết đơn giản nhưng lại bất tiện về nhiều mặt, ví dụ như nó không hỗ trợ lồng nhau và mã dư thừa; nó không hỗ trợ kế thừa và trộn lẫn, mã không dễ sử dụng lại. để cung cấp cho c
Làm cách nào để biên dịch mô-đun sass (phiên bản mới của sass)? https://css-tricks.com/introducing-sass-modules/ Tôi đã thử thiết bị đầu cuối sass-migrator nhưng nó không biên dịch được ht
Trong SASS, khi xảy ra lỗi, nó sẽ hiển thị thông báo ở đầu trang trong trình duyệt. Một mẫu của nó có trong hình ảnh đính kèm. Văn bản này không thể chọn được. Nó không phải là một hình ảnh. Nó sẽ không hiển thị trong Xem nguồn. Nó không hiển thị trong Fireorms. Cách trình bày văn bản lỗi
Tôi muốn quyết định thời điểm biên dịch tệp .sass. Nói cách khác, tôi không muốn xem tệp mà biên dịch nó theo cách thủ công. Tôi nên làm gì? Câu trả lời hay nhất Nó đơn giản hơn tôi nghĩ: sass style.scss style.css Giới thiệu về sass - Làm sao để tôi không xem
Tôi ước gì có một bản mixin như +stacktextshadow(blue, red, green) tạo bóng văn bản: 1px 1px 0 blue, 2px 2px 0 red, 3p
Tôi muốn sử dụng SASS trên ứng dụng web của công ty chúng tôi, nhưng tôi không thể cài đặt bất cứ thứ gì trên máy sản xuất. Mọi thứ tôi tìm kiếm về SASS đều yêu cầu bạn chạy trình cài đặt giống như gem và cũng yêu cầu HAML. Tôi hy vọng tìm được kịch bản
Từ tài liệu tôi thấy rằng bạn có thể thay đổi vị trí bộ đệm của SASS. Tuy nhiên, tôi không chắc chắn về cú pháp chính xác để sử dụng. Tôi có một dự án Zurb Foundation và cùng với đó là tệp config.rb. Tôi nghĩ điều này cần được cập nhật để thay đổi bộ nhớ đệm
Có lẽ câu hỏi hay hơn là có cách nào hiệu quả hơn để ghi đè một phần của mixin không? SCSS này: nút @mixin { .button { màu nền: đỏ;
Tôi đang sử dụng nhận xét nhiều dòng /**Các kiểu phổ biến xem tại đây*/Định nghĩa kiểu tiếp tục... Tôi gặp lỗi khi biên dịch. Nó báo: Lỗi: CSS không hợp lệ sau "*/": mã định danh dự kiến,
Tôi đang cố gắng sử dụng gói sass thay vì node-sass trong Nuxt.js. Tôi đã tìm thấy một cấu hình như thế này; // vue.config.js module.exports = { css: {
Tôi đang sử dụng nhận xét nhiều dòng /**Các kiểu phổ biến xem tại đây*/Định nghĩa kiểu tiếp tục... Tôi gặp lỗi khi biên dịch. Nó báo: Lỗi: CSS không hợp lệ sau "*/": mã định danh dự kiến,
Tôi đang cố gắng sử dụng gói sass thay vì node-sass trong Nuxt.js. Tôi đã tìm thấy một cấu hình như thế này; // vue.config.js module.exports = { css: {
Lặp lại câu hỏi? Đúng. Nhưng nó hơi khác một chút so với phần tổng quan này: Tôi cũng chưa quen với trình soạn thảo văn bản trong ngoặc. Tôi biết sự khác biệt giữa Scss và Sass. Nhưng lý do tôi sử dụng trình soạn thảo văn bản ngoặc chỉ dành cho Sass chứ không phải Scss. Cưa J
Tôi đang tìm kiếm một bóng văn bản mixin như +stacktextshadow(blue, red, green): 1px 1px 0 blue, 2px 2px 0 red, 3px
Tôi quyết định xóa node-sass khỏi dự án gatsby của mình và thay vào đó sử dụng sass. Tôi đã làm theo những gì được đề cập ở đây cho v3. Tôi đã xóa node-sass và bây giờ tôi có các phiên bản này trong pack.json của mình: "g
Tôi đang sử dụng vanilla Sass (không có Compass/SUZY/Bourbon/v.v.) và tôi không thể tìm ra nơi để đặt các tệp *.rb. Tôi không phải là lập trình viên Ruby, nhưng tôi đã tìm thấy một hàm do người khác viết,
Tôi mới bắt đầu sử dụng gulp-sass, có cách nào "dễ dàng" để biết tôi đang sử dụng phiên bản Sass nào không? Không phải tôi nghĩ điều này quá quan trọng, nhưng tôi đang sử dụng gulp-sass trong Visual Studio 2015 (CT
Tôi đang triển khai plugin grunt để xử lý css cho sass nhưng có 2 tùy chọn có sẵn là grunt-contrib-sass và grunt-sass. Tôi đã tìm kiếm trên internet nhưng không tìm thấy câu trả lời nào phù hợp cho grunt-c
Tôi đang cố gắng sử dụng các biến CSS và hàm Sass (chính xác là lighten()/darken()) trong một dự án Angular và theo như tôi biết thì phiên bản mới nhất của LibSass cho phép điều này. Tôi đã cài đặt nút-sas
Tôi là một lập trình viên xuất sắc, rất giỏi!