day23知識
メディアクエリ：デバイスタイプとモニタリングデバイスの特性式で構成されます
構文：@mediaデバイスタイプ[すべての\画面]と（条件式）{
cssスタイル
}
注：デバイスタイプの前ではなく、両側にスペースが必要です（逆選択[範囲を除外]）
メディアクエリ：スタイルを少し調整します
例：
フローティング
隠し
テキストを表示テキストサイズ
幅と高さ
モバイル：メタタグ設定：1：1の比率のビューポート、ユーザーのズームを禁止
デバイスピクセル比dpr
RetinaスクリーンRetina HDディスプレイ
ppi：每英寸所显示像素点的密度（ppi值越高 屏幕显示越清晰）
dpi：每英寸所显示像素点的个数
dpr：设备像素比例
dpr==物理像素（把手机上图片截图放在ps中量取的大小）/逻辑像素（css去设置的像素）
dpr怎么获取
根据ui设计图：绝大部分拿到的设计图打 750px/640px
针对性对dpr进行获取：
如果设计图为640px 或者 750px 选取dpr（2） 例如640/2=320
如果设计图为大于750培训 选取dpr（3）
rem
remの新しい単位：remの相対サイズはhtmlのfont-size値に相当します。デフォルトの
レイアウトは1rem = 16px rem（同等のスケーリング）です
计算流程：假如设计图为750px
首先：考虑dpr为2 =325px
：ps中量出某个元素为88px（随意量的）
：设置css大小时候88px/dpr（2）=44px
：又因为不能固定44px（44px固定之后就不能放大或者缩小）
：所以44px转成re
：因为html中的font-size：100px；（可以调） 1rem=100px
：44px=0.44rem
vw 单位 ： 视口的宽的比例 100vw == 视口宽度的100%
vh ： 视口高度的比例 100vh == 视口高度的100%
vmin : 视口的宽和高进行比较 谁小我用谁
vmax ： 视口的宽和高进行比较 谁大我用谁
