cách viếc css bằng sass

copy nội dung này vào file packege.json

{
  "name": "giaodien_tuongtac",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "sasstocss": "node-sass sass/main.scss css/style.css"
  },
  "author": "Le Van Hiep",
  "license": "ISC",
  "dependencies": {
    "node-sass": "^6.0.1"
  }
}

Chạy lệnh 

npm install 

tại thư mục root tạo file ten_file.bat nội dung như sau

npm run sasstoscss 

Tạo file main.sass trong thư mục sass, tạo 1 thư muc css

chạy file bat vừa tạo để của sổ cmd sau khi chạy, không đc tắt

Tiến hành viết css trong file main vừa tạo, sau khi save thì code sẽ tự nhận css bên file stye. lấy file style nhúng vào web

cách viết sass theo cấp ngoài vào trong. xem ví dụ

.head_search{

     position: relative;

     padding-top: 10px;

     .head_search_one .head_input {

          input{

               width: 80%;

               display: inline-block;

               float: left;

               border-radius: 5px 0px 0px 5px;

          }

 

          button{

               width: 20%;

               display: inline-block;

               border-radius: 0px 5px 5px 0px;

               background-color: #ffca21;

          }

     }

}