SCSS是什么
加強版的CSS
SaSS的歷史
Awesome非常厲害的類CSS語言2007年第一版2016年完全成熟
把所有括號分號冒號都去掉的CSS
SCSS在Sass基礎上把括號冒號分號都又重新加了回來Ruby語言寫的 Rails全棧框架
安裝與運行
零配置學習-使用parcel parcel代替webpack的
npx parcel index.html把你的html跑起來
零配置學習-使用jsbin.com
最簡單的幾個語法
1.嵌套選擇器 2.變量 3.mixin 4.placeholder
可以使用變量
如$r:red; h1{color:$r}
可以使用嵌套
如：body{border:1px solid red;
>ul{
border:2px solid green;
}
}
可以把一堆代碼寫在一起，起一個名字，在不同地方使用，這種方法叫mixin，還可以接受變量，并且設置默認值，選擇器不放一起，樣式每次都復制一次
mixin只是把代碼機械的復制了，并沒有節(jié)省代碼量，為了解決這個問題，發(fā)明了placeholder，樣式寫一次，選擇器放一起
在線編碼網(wǎng)站jsbin codepen codesandbox
BEM（block element modifier） CSS命名法
- 主要名字.user-card
- 細節(jié)部分 .user-card__picture .user-card__name
- 狀態(tài)部分 .user-card--active
直接加&符號可以省略前置部分代碼
嵌套屬性，屬性也是可以嵌套的，比如font-size,font-family可以嵌套寫
注釋，
css注釋/這是CSS注釋/
sass注釋//這是sass注釋
變量也是可以有作用域的CSS變量的作用域覆蓋
支持加減乘除取余
顏色相關運算，提供了一套操控顏色的函數(shù)，30多種關于顏色的函數(shù)
關于字符串插值
配置好功夫劇，直接開干
一套css，適應所有手機，
只用vw，放棄所有px，用頁面寬度作為我們布局的唯一標準
mixin %和function的區(qū)別
vue-ElementUI餓了么出品 新時代的bootstrap
react-AntDesign阿里巴巴出品
vue-cli單間vue的應用
如果在gitbash下出現(xiàn)無法上下選中的情況，需要更換命令行工具，或者百度一下即可解決
elementUI最高級的用法就是找到你想要的，放到合適的地方
et -i會生成sass文件
et 會把sass文件編譯成需要的文件
首先全局安裝vue-cli
然后使用vue-cli創(chuàng)建vue的hello-world
在hello-world里面引入element-ui
基于elementUI使用et（element-theme）工具創(chuàng)建index.css
將index.css引入vue，舊可以得到新的elementUI
一個項目只能使用npm或yarn不能同時使用
SCSS配置多頁面
新建文件夾
npm init -y初始化
引入webpack，webpack-cli，最好使用yarn來安裝
運行npx webpack npx默認與nodejs同時安裝，無需額外安裝
在webpack.config.js中設置模式，開發(fā)或者生產(chǎn)模式
安裝webpack-dev-server
安裝html-webpack-plugin插件
運行webpack-dev-server npx webpack-dev-server
