Nếu bạn là người dùng thường xuyên của CodePen. io, bạn sẽ nhận thấy rằng có một số tùy chọn khi nói đến hương vị của CSS mà bạn có thể chọn
- SASS với La bàn
- SCSS với La bàn
- ÍT HƠN
- CSS thông thường
Đừng nhầm lẫn giữa các tùy chọn SASS và SCSS, mặc dù ban đầu tôi. scss là Sassy CSS và là thế hệ tiếp theo của. ngổ ngáo. Một lời giải thích từ trang web
Sass có hai cú pháp. Cú pháp được sử dụng phổ biến nhất được gọi là “SCSS” (viết tắt của “Sassy CSS”) và là siêu bộ cú pháp của CSS3. Điều này có nghĩa là mọi biểu định kiểu CSS3 hợp lệ cũng là SCSS hợp lệ. Các tệp SCSS sử dụng phần mở rộng. scss
Cú pháp thứ hai, cũ hơn được gọi là cú pháp thụt lề (hoặc chỉ “. ngổ ngáo”). Lấy cảm hứng từ sự ngắn gọn của Haml, nó dành cho những người thích sự đồng nhất hơn là sự tương đồng với CSS. Thay vì dấu ngoặc và dấu chấm phẩy, nó sử dụng thụt đầu dòng để chỉ định các khối. Các tệp trong cú pháp thụt lề sử dụng phần mở rộng. ngổ ngáo
Giải thích về SASS vs SCSS trên sass-lang. trang web com
Nếu điều đó không hợp lý, bạn có thể thấy sự khác biệt trong mã bên dưới
/* SCSS */
$blue: #3bbfce;
$margin: 16px;
.content-navigation {
border-color: $blue;
color: darken($blue, 9%);
}
.border {
padding: $margin / 2; margin: $margin / 2; border-color: $blue;
}
Trong đoạn mã trên, chúng tôi sử dụng ; để tách các khai báo. Tôi thậm chí đã thêm tất cả các khai báo cho .border vào một dòng để minh họa thêm điểm này
Ngược lại, mã SASS bên dưới phải nằm trên các dòng khác nhau có thụt đầu dòng và không được sử dụng ;
/* SASS */
$blue: #3bbfce
$margin: 16px
.content-navigation
border-color: $blue
color: darken($blue, 9%)
.border
padding: $margin / 2
margin: $margin / 2
border-color: $blue
Bạn có thể thấy từ CSS bên dưới rằng kiểu SCSS giống với CSS thông thường hơn nhiều so với cách tiếp cận SASS cũ hơn
/* CSS */
.content-navigation {
border-color: #3bbfce;
color: #2b9eab;
}
.border {
padding: 8px;
margin: 8px;
border-color: #3bbfce;
}
Tôi nghĩ hầu hết thời gian hiện nay nếu ai đó đề cập rằng họ đang làm việc với Sass thì họ đang đề cập đến việc viết trong đó. scss chứ không phải truyền thống. cách hỗn xược
Bạn cũng có thể muốn xem một số @mixins hữu ích sẽ giúp bạn xây dựng phản hồi nhanh
Trước khi bạn đi
Tôi biết, một bản tin khác - nhưng hãy nghe tôi nói. Hầu hết các bản tin JavaScript đều tệ. Lần cuối cùng bạn thực sự mong muốn có được một cái là khi nào?
Chúng tôi gọi nó là Byte, nhưng những người khác gọi nó là bản tin yêu thích của họ
tham gia byte
Được gửi tới 152.074 nhà phát triển vào mỗi thứ Hai và thứ Năm
Sdu
@sduduzo_g
Đây là bản tin đầu tiên mà tôi mở danh sách phát nhạc và tối đa hóa cửa sổ trình duyệt của mình chỉ để yên tâm đọc nó. Kudos để @uidotdev cho nội dung hàng tuần tuyệt vời
Brandon Bayer
@flybayer
Bản tin Bytes là một tác phẩm nghệ thuật. Đó là bản tin dành cho nhà phát triển duy nhất mà tôi đã đăng ký. Bằng cách nào đó, họ lấy những thứ hơi nhàm chán và truyền vào đó một lượng hài vừa phải để khiến bạn cười khúc khích
John Hawley
@johnhawly
Bytes là bản tin yêu thích của tôi kể từ khi thành lập. Đó là điều yêu thích của tôi mà tôi mong đợi vào thứ Hai. Tuyệt vời với một tách cà phê nóng
màu xanh lá cây Garrett
@garrettgreen
Tôi đăng ký RẤT NHIỀU bản tin dành cho nhà phát triển (đặc biệt là JS/TS/Node) và Byte của @uidotdev luôn là một sự thay đổi thú vị, được hoan nghênh đối với hầu hết (hài hước, vui vẻ, v.v.) nhưng vẫn toàn diện/hữu ích
Muhammad
@mhashim6_
Thực sự là bản tin duy nhất mà tôi chờ đợi mỗi tuần
Grayson Hicks
@graysonhicks
Bytes là bản tin dành cho nhà phát triển mà tôi mong chờ nhất mỗi tuần. Cân bằng tuyệt vời giữa nội dung và ngữ cảnh. Cảm ơn @uidotdev
Mitchell Wright
@mitchellbwright
Tôi biết tôi đã nói điều đó trước đây, nhưng @tylermcginnis không bỏ lỡ email Bytes. Nếu bạn là nhà phát triển, bạn thực sự cần phải đăng ký
Ali Spittel
@aspittel
Tôi có thể nói rằng tôi cười khúc khích mỗi khi nhận được email @uidotdev mỗi tuần không?
Chris Finn
@thefinnomenon
Mọi lập trình viên JavaScript nên đăng ký nhận bản tin từ @uidotdev. Họ không chỉ quản lý để đưa tin ngắn gọn về những tin tức nóng hổi trong thế giới JavaScript trong tuần mà họ còn quản lý để thêm sự hài hước mới mẻ vào tất cả