CSS+HTML NOTE 2

** GIỚI THIỆU SASS**
** CÀI ĐẶT NODE-SASS VÀ TẠO FOLDER SASS**

 - Tạo file main.scss và copy code từ style.css.
- Tạo script để run compiler.

- npm install live-server để cập nhật code.

*Chuyển đổi các dữ liệu được dùng lặp lại sang các biến
- Có thể dùng rgba($color-black, 0.2)
- Các biến về màu sắc: $color-...
- Chuyển các css con vào trong nest của css cha bằng &

* Trong sass folder tạo folder base: Chứa các chức năng tương ứng trong các file con
- Tạo file _base.scss trong folder base (lưu ý cần có _)
- Gọi file _base.scss trong main.scss bằng lệnh @import "base/base" - tên file lúc này không cần _
- Tạo thêm các file _animations.scss, _typography.scss; _ultilities.scss.

* Trong sass folder tạo folder abstract: Là các file thực thi các lệnh scss.
- Trong folder abstract tạo các file: _variables.scss; _mixins.scss; _functions.scss
* Trong sass folder tạo folder layout: Để lưu trữ file scss của từng phần (header, footer...)
* Trong sass folder tạo folder components
* Trong sass folder tạo folder pages: Để chứa các page riêng lẻ, ví dụ landing page...
- Trong folder pages tạo các file: _home.scss;
* Khai báo toàn bộ file trong main.scss như hình sau:


- Copy tất cả các biến (màu sắc) đã khai báo trong main.scss vào trong file _variable.scss của folder abstracts.


- copy toàn bộ phần code đầu tiên bao gồm reset về mặc định, css của thẻ html và thẻ body vào trong file _base.scss


- copy toàn bộ phần animations (@keyframe(...)) vào file _aniamtions.scss


- Trong components tạo file _buttons.scss và copy toàn bộ code phần .btn vào file này để dùng lại nhiều lần.


- import file _buttons.scss vào file main.scss
- copy css của thẻ header vào layout/_header.scss


- imports _header.scss vào main.scss
- copy code phần .heading-primary vào file _typography.scss (liên quan đến định dạng cho chữ viết) vào import ngược lại file main.scss


- Có thể copy cả phần định dạng chữ viết trong thẻ header vào file _typography.scss này.

* Fluid layout + Responsive layout




Nhận xét

Đăng nhận xét

Bài đăng phổ biến từ blog này

#7 Phương pháp xác định nhanh 6 mẫu âm giai trong Guitar Lead

Hình ảnh
Phương pháp xác định nhanh 6 mẫu âm giai trong Guitar Lead Vị trí 6 mẫu âm giai tone C/Am trong Guitar Lead TH1: Chọn nốt C trên dây 6 - Xác định nốt chủ C trên dây 6 ngăn 8 --> Có thể chọn mẫu ngăn 7, hoặc 5 nhưng bắt đầu từ nốt C (để chạy nốt trong mẫu). (trong trường hợp chơi ở đô trưởng). - Nếu chơi ở rê trưởng ta dịch lên 2 ngăn, la trưởng dịch xuống 3 ngăn, tương tự như vậy với các giọng khác, dịch theo quãng. - Từ các âm giai trưởng dịch xuống 3 ngăn sẽ ra thế bấm của âm giai thứ song song với nó. --> Chỉ cần xác định từ âm giai C trưởng là ra hết các âm giai khác. --> Điểm khác biệt của âm giai trưởng và thứ là nốt bắt đầu tương ứng với việc chơi ngón giữa cho âm giai trưởng và ngòn trỏ cho âm giai thứ. TH1: Chọn nốt C trên dây 5 - Nốt C này thuộc 2 mẫu âm giai đầu tiên và ngăn 3. - Tương tự lấy nốt C là nốt bắt đầu khi chạy hai âm giai trên. - Dịch theo quãng để ra các tone khác. - Dịch để suy ra âm giai thứ song song với nó. - Vẫn nốt bắt đầu ...
Đọc thêm

Làm Chủ 7 Mode Trong Guitar Lead [Chơi ở tất cả các Tone]

Hình ảnh
Làm Chủ 7 Mode Trong Guitar Lead [Chơi ở tất cả các Tone] 7 mode Mode 3 : Tone chủ Em: E - G - B Các nốt dừng/nối câu lead (màu đỏ): Tone chủ Em: E - G - B Mode 4:  Tone chủ F:  F - A - C (bậc 4 - 6 -1) Khi chơi chỉ cần nhớ mẫu hình mode, sau đó tìm node vào theo bậc của nó (1,3,5) của hợp âm đó. Mỗi Mode khi xê dịch sẽ lại cho ra các tông khác nhau dùng mode đó.
Đọc thêm

#1 Âm giai trưởng (The major Scale) và Pattern 6/4

Hình ảnh
#1 Âm giai trưởng (The major Scale) và Pattern 6/4 Nguồn:  https://www.youtube.com/watch?v=M7OLG_R4RQo&list=PLYEiBIjLQLwv5xRH_IOhipwizSIko5HPe&index=7 6 - dây 6 ; 4 - 4 ngón 1 - 4 tương ứng từ trở đến út. Phần mềm đánh nhịp: metronome 80 - 120 Âm giai trưởng có 7 nốt: C D E F G A B C Cấu trúc: 2 2 1 vs 2 2 2 1 --> âm giai trưởng. 2 - 1 cung - 2 ngăn; 1 - nửa cung - 1 ngăn. Thăng, giáng để đáp ứng quy tắc 2 2 1 vs 2 2 2 1. Bậc âm giai là thứ tự các nốt trong âm giai: Do đó vị trí các bậc trên cần đàn của một âm giai như sau: VD: 1 - 2: 2 ngăn (1 cung); 3 - 4: 1 ngăn (nửa cung); 7 - 1: 1 ngăn (nửa cung).
Đọc thêm