Media Query 引用方式

Media Query 的使用方式有兩種：
1. 用 @media 來判斷使用者螢幕寬度，選擇載入哪一段 CSS
Ex:
@media screen and (max-device-width: 480px) {
    }

在螢幕小於 480px時，套用此 CSS

-----------

2. 在載入的地方，用 media 屬性判斷使用者裝置寬度，選擇載入哪一個 CSS 檔案
Ex:
<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="middleScreen.css">

螢幕小於480px時，套用 middleScreen.css

-----------------

Viewport設定
<meta name="viewport" content="width=device-width; initial-scale=1.0">