?媒體查詢
@media 表示媒體查詢
screen 運(yùn)行的設(shè)備條件
? ? ? and且
? ? ? max-width尺寸條件
? ? ? ==è 同時(shí)滿足設(shè)備條件和尺寸條件的時(shí)候，代碼才生效吭历。
媒體查詢的使用：找條件
1：確定當(dāng)前頁面的css樣式以什么端為主的
2：在html元素結(jié)構(gòu)相同，pc端與移動(dòng)端布局不同的時(shí)候，
在特殊尺寸下有特別的樣式，適合使用媒體查詢
3：搭建自己的柵格系統(tǒng)時(shí)適合使用媒體查詢
1.主要的布局為pc端 兼容移動(dòng)端
? ? ? ? 條件是pc端與移動(dòng)端臨界間條件
? ? ? ? 注意：移動(dòng)端的基礎(chǔ)樣式是媒體查詢外樣式。==> 樣式?jīng)_突思路混亂
1: 無論基礎(chǔ)樣式是什么帖世，在媒體查詢中一律重寫所有的樣式取董，
所有的選擇器
? 2在進(jìn)行代碼優(yōu)化處理
? ? ? ? 刪除相同選擇器中 相同樣式
?圖片格式
所有變更圖片大小的屬性全部都是在消耗瀏覽器性能
? ? ? ? ====>為了提高性能棍苹，直接使用原圖
png、jpg茵汰、gif 這些圖片格式解釋一下枢里，分別什么時(shí)候用。有沒有了解過 webp蹂午？
? ? ? png 無損圖片
? ? ? jpg? 有損圖片? ? ? ?
????????gif? ? 動(dòng)圖? 無損
? ? ? webp? 谷歌的栏豺，支持有損無損 壓縮圖
? ? ? ? div:after? 與 div::after 偽元素 與偽類選擇器的區(qū)別是什么？
? ? ? ? 偽類選擇器的作用 選中html添加樣式
? ? ? ? 偽元素：是在元素前面或者后面添加一個(gè)元素豆胸，可以具備所有元素的特點(diǎn)
