Sass – Viết css nhanh hơn, tốt hơn – Phần 3/3: Các mẹo nhỏ

Hello ae, chào mừng ae tới livestream chữ của mình. Đây là phần cuối rồi, là phần cuối nhưng nhiệt huyết viết bài của mình vẫn hừng hực lắm. Ae yêu thương thì bổ cho mình 1 quả LIKE 1 quả SHARE ae nhé, đừng quên donate cho mình theo stk mình ghim ở phần bình luận. Thanks ae!

Hôm nay mình sẽ nói về một vài kinh nghiệm của mình nhé

1. Import scss

  • File import sẽ có dạng “_filename.scss”
  • Cú pháp import sẽ là: @import ‘filename’; hoặc @import ‘filename.scss’;

2. Tổ chức file scss

Trong một project mình thường viết và chia file .scss thành nhiều nhóm khác khau:

libs = các file .scss sử dụng xuyên suốt dự án

_libs-resetthiết lập css mặc định
_libs-variableskhai báo các biến
_libs-mixinskhai báo các mixin

comps = các thành phần phổ biến (header/footer/navbar…)

_comps__layout-headerkhai báo layout header
_comps__layout-footerkhai báo layout footer
_comps__base-navbarkhai báo navbar
_comps__base-typoKhai báo typography
_comps__base-colorKhai báo màu sắc
_comps__base-formKhai báo các thuộc tính form (field, button, select,…)

Series làm quen với Sass tới đây là hết rồi. Như thường lệ, ae hãy đọc lại lần nữa và ghi lại những key points mà ae thấy quan trọng, sau đó viết test vài dòng cho nhớ lâu nhé ae.

Hẹn gặp ae ở series 10 phần mình đang ấp ủ viết: Tán gái đại pháp – 10 bí mật chưa kể.


Posted

in

by

Tags:

Comments

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *