ASP.NET MVC Razor 語法中的 @ 符號與媒體查詢設定的衝突問題

當網頁中透過媒體查詢的設定以支援響應式功能會與 Razor 語法衝突…

當網頁中透過媒體查詢的設定以支援響應式功能,通常必須撰寫類似以下的媒體查詢語法:
 

@media screen and (min-width:561px) {
            .book-cover {
                floatleft;
                width50%;
                text-align:center;
            }
            
}


這段語法一開始以 @ 符號為字首進行設定,由於 ASP.NET MVC 網頁的 Razor 語法亦是以 @ 符號作為語法辨識字元,如果這段媒體查詢設定寫在 .cshtml 網頁檔案中,就會造成不必要的衝突。

為了避免上述的情形,將其修改如下:
 

@@media screen and (min-width:561px) {
            ....
            
}
 

直接配置兩個連接的 @ 符號即可。