@media媒体查询和ASP.NET MVC剃刀语法冲突

问题描述：

我有一个使用Razor视图引擎在ASP.NET MVC中运行的大型网站。@media媒体查询和ASP.NET MVC剃刀语法冲突

我有一个基础样式表，其中包含整个网站的所有通用样式。然而，有时候，我在页面的<head>中有页面特定的样式 - 通常这是一行或两行。

我不是特别喜欢把CSS放在<head>中，因为它不是严格区分顾虑，但对于一两行，确实是特定于该页面的，我不喜欢附加另一个文件并添加到带宽。

我有，虽然在这里我想提出一个页面特定媒体查询到<head>一个实例，但由于媒体的查询使用@符号和括号{}它的冲突与剃刀语法：

@section cphPageHead{ 
    <style> 
     /* PAGE SPECIFIC CSS */ 
     ... 

     @media only screen and (max-width : 960px) <-- the @ symbol here is clashing! 
      { 
       ... } 
      } 
    </style> 
}

有没有办法解决这个问题？

我仍然认为''CSS样式'应该在CSS文件中，特别是对于“大型网站”。页面上的线性CSS不是最佳实践。 * PS：我的意见* – AlexC

答

使用双@@符号。那会逃跑@符号和正确呈现@media在客户端

答

还记得后双@@添加一个空格：

@@ media only screen and (max-width : 960px)

@@media没有空间也没有为我工作。

使用压缩CSS时遇到类似问题;我认为@@被文字所包围，因此剃刀努力去解读它。我选择在@@之前添加空格。谢谢你的提示。 – Anthony

@media媒体查询和ASP.NET MVC剃刀语法冲突

相关推荐