Nếu bạn là một lập trình viên Front end, Lập trình viên Web bạn sẽ biết CSS có thể rất thú vị. Trong Sass, bạn có thể sử dụng các toán tử khác nhau để thực hiện các thao tác như nối chuỗi, nối màu, v.v.
Sass string
Sass add string
SASS là viết tắt của từ Syntactively Awesome Style Sheets. SASS là ngôn ngữ kịch bản và bộ tiền xử lý CSS, biên dịch mã thành CSS để giúp bạn viết CSS nhanh hơn, dễ dàng hơn, thanh lịch hơn. SASS bổ sung các tính năng và công cụ mới trên CSS cơ bản giúp bạn sắp xếp CSS tối ưu hơn, dễ duy trì, sửa chữa hơn. Bằng cách mở rộng mã CSS, SASS làm cho các dự án lớn thân thiện hơn. 
SASS hiểu đơn giản là bộ tiền xử lý CSS và có cú pháp cũ hơn sử dụng thụt lề để tổ chức và tách các khối code. Về cơ bản, nó cung cấp một cách viết CSS đơn giản hơn, mở rộng chức năng của CSS. Các tệp SASS sử dụng dạng đuôi mở rộng “.sass” . Nhìn chung, đây là những ưu điểm mà các lập trình viên đã xác nhận cho cả SCSS và SASS
Sau thời gian dài sử dụng khi các file CSS của bạn lớn hơn, chúng sẽ khó quản lý, bảo trì và sắp xếp hơn. Đó là lúc mà bộ tiền xử lý CSS như SASS xuất hiện để giúp bạn tiết kiệm thời gian quản lý kho theme wordpress hơn. SASS giúp cho các lập trình viên front-end nâng cao các kỹ năng với các tính năng độc đáo. SASS mở rộng khả năng của CSS. Hôm nay chúng ta sẽ cùng tìm hiểu, cùng tham khảo SASS như một người mới bắt đầu để bạn dần quen với công cụ viết CSS thực tế này.
Sass string replace
Bây giờ bạn có biết về một số tính năng của SASS có thể thay đổi level lập trình thiết kế web front-end của bạn. SASS string replace làm cho CSS của bạn đơn giản hơn, đáng tin cậy hơn và có tổ chức hơn. Trên hết, học SASS cũng không hề khó khi đã biết CSS. 
| Tên hàm | Mô tả |
|---|---|
quote($string) |
Thêm cặp quote bao quanh chuỗi $string |
unquote($string) |
Xóa các cặp quote ra khỏi chuỗi $string |
str-length($string) |
Trả về tổng số ký tự của chuỗi $string |
str-insert($string,$insert,$index) |
Thêm chuỗi $insert vào chuỗi $string tại vị trí $index |
str-index($string, $substring) |
Kiểm tra vị trí xuất hiện chuỗi $subtring trong chuỗi $string |
str-slice($string,$start-at,[$end-at]) |
Cắt chuỗi bắt đầu từ $start-at và kết thúc tại $end-at, trường hợp không truyền $end-at thì nó lấy đến cuối chuỗi. |
to-lower-case($string) |
Chuyển chuỗi $string sang chữ in thường |
to-upper-case($string) |
Chuyển chuỗi $string sang chữ in hoa |
Strings in Sass
CSS hỗ trợ các chuỗi trích dẫn kép và đơn, cũng như các chuỗi không trích dẫn như Georgia, serif hoặc sans-serif. Sass hỗ trợ cả ba và thường biên dịch thành cùng một loại dấu ngoặc kép hoặc thiếu dấu ngoặc kép trong CSS.
Ví dụ: bạn đang sử dụng biến sass để giữ kiểu chữ của dòng tiêu đề chính, được đặt trên h1 của bạn như sau:
[code type=css]
h1 {font-family: $headline-typeface;}
[/code]
Sử dụng các chuỗi trích dẫn không trích dẫn, trích dẫn đơn và trích dẫn kép trong các biến thiết kế web chuẩn seo của bạn:
[code type=css]
$headline-typeface: Lucida Grande;
$headline-typeface: ‘Lucida Grande’;
$headline-typeface: “Lucida Grande”;
[/code]
Sẽ biên dịch thành:
[code type=css]
h1 { font-family: Lucida Grande; }
h1 { font-family: ‘Lucida Grande’; }
h1 { font-family: “Lucida Grande”; }
[/code]
Nói cách khác, bất kỳ loại trích dẫn nào (hoặc không có trích dẫn) bạn đã sử dụng trong sass sẽ xuất hiện trong tệp CSS kết quả của bạn.
Nguyễn Minh Hiếu (Website: sieutocviet.net)
Với hơn 3 năm kinh nghiệm Python / PHP / CSS / JS / WORDPRESS, 5 năm kinh nghiệm trong quản trị website tư vấn giải pháp SEO từ khóa, Marketing tối ưu nhất cho doanh nghiệp. Chuyên viên tư vấn sản phẩm: Hosting, Email doanh nghiệp, VPS, App web design.
Hiện đang là trưởng phòng kinh doanh tại Siêu Tốc Việt.