Question

我对Visual Studio 2010有一个非常奇怪的问题。当我为我的样式表添加渐变的CSS属性时，Visual Studio会在调试一段时间后将其删除。

我添加到样式表的代码示例：

.button
{
    /* Firefox */
    background-image: -moz-linear-gradient(top, #fff, #efefef);
    /* Chrome, Safari */
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #fff),color-stop(1, #efefef));
    /* Modern Browsers*/
    background-image: linear-gradient(top, #fff, #efefef);
    /* IE */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#efefef'); 
}

有时当我开始调试时，Visual Studio会编辑CSS：

.button
{
    /* Firefox */
    background-image: linear-gradient(top, #fff, #efefef);
    /* Chrome, Safari */
    /* Modern Browsers*/
    }

因此Visual Studio似乎删除了一些它不知道的属性。这真的很烦人。 我知道如何阻止它吗？

这不是CSS评论的问题。它也会在没有评论的情况下发生。

更新

似乎通过保存包含css文件的文件来实现。当我编辑我的主版面并保存它时，Visual Studio将删除我在链接的css文件中提到的这些属性。

它的 NOT 是一个CSS3问题，因为它不会触及我的border-radius类和id。所以也许它是过滤属性。不过，我想停止的Visual Studio改变我的CSS文件万物而不权限。

更新27. 2014年6月

Visual Studio 2013中已解决问题 https://connect.microsoft.com/VisualStudio/feedback/details/782677/visual-studio-is-deleting-css

Answer 1

好的，我找到了一个临时解决方法：

“过滤器：”样式的存在导致所有“background-image：”样式消失，除了列出的最后一个样式。并不是它正在删除它没有的内容知道，它只是删除除了列出的最后一个“背景图像”样式。必须是Microsoft（预期）的方式使过滤器和MS特定的背景图像样式很好地一起播放，但是它们没有很好地编码。绝对是MS VS缺陷。要重新启动，只需右键单击具有类似代码的CSS类：

background-color: #EBEBEB; /* Fallback background color for non supported browsers */  
background-image: -webkit-gradient(linear, left top, right top, from(#FFFFFF), to(#DAD6E7));  
background-image: -webkit-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -moz-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -ms-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -o-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: linear-gradient(left, #FFFFFF, #DAD6E7);  
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FFFFFF', EndColorStr='#DAD6E7', gradientType='1'); /* IE6 - IE9 */

然后选择“Build Style ...”。然后单击“确定”而不更改任何内容，并观察除去最后一个背景图像以外的所有图像。尝试更改“背景图像样式的顺序，最后留下webkit，然后自己查看。

您会注意到，如果删除“filter：”样式，问题就会消失，但我们需要（对于此示例），因此解决方案似乎正在将“filter：”样式移到所有“background-image：”行。一旦你这样做，就会让他们独自一人，问题就会消失。

将上述CSS更改为此似乎可以解决问题：

filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FFFFFF', EndColorStr='#DAD6E7', gradientType='1'); /* IE6 - IE9 */
background-color: #EBEBEB; /* Fallback background color for non supported browsers */  
background-image: -webkit-gradient(linear, left top, right top, from(#FFFFFF), to(#DAD6E7));  
background-image: -webkit-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -moz-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -ms-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: -o-linear-gradient(left, #FFFFFF, #DAD6E7);  
background-image: linear-gradient(left, #FFFFFF, #DAD6E7);

的更新： 的上面的解决方法仅适用于当您使用“构建样式...”时VS应用格式时 - ＆gt; “修改样式”对话框，因为我刚刚看到上面的修复程序，所以它必须来自其他地方。

Answer 2

渐变是CSS3属性。

Visual Studio不支持CSS3和HTML5，这可能是问题所在但是对HTML5 & CSS3 in Visual Studio 2010 SP1的支持那么，为什么不下载Visual Studio 2010 SP1并尝试？

Answer 3

在Visual Studio中尝试：工具＆gt;选项＆gt;文本编辑器＆gt; CSS＆gt;杂项关闭检测错误。我这样做并使用上面的示例文件，运行解决方案，关闭文件，关闭解决方案，我的代码仍在那里： - ）

Answer 4

我在VS2010中也经历过同样的问题，并且可以确认问题不会影响CSS3样式。我可以建议的唯一工作是在评论中放置消失线的副本，这样至少很容易再次复制。

/* filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#efefef'); */
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#efefef');

Answer 5

我没有Visual Studio来测试这个，但是从其他评论和答案中读取信息，似乎您可能会尝试将filter完全分离为重复的选择器定义 。像这样：

.someClass {
  background-color: #EBEBEB; /* Fallback background color for non supported browsers */  
  background-image: -webkit-gradient(linear, left top, right top, from(#FFFFFF), to(#DAD6E7));  
  background-image: -webkit-linear-gradient(left, #FFFFFF, #DAD6E7);  
  background-image: -moz-linear-gradient(left, #FFFFFF, #DAD6E7);  
  background-image: -ms-linear-gradient(left, #FFFFFF, #DAD6E7);  
  background-image: -o-linear-gradient(left, #FFFFFF, #DAD6E7);  
  background-image: linear-gradient(left, #FFFFFF, #DAD6E7);  
}

.someClass { /* repeated to isolate filter */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FFFFFF', EndColorStr='#DAD6E7', gradientType='1'); /* IE6 - IE9 */
}

这是一个真正的痛苦，但如果它解决了你的问题，直到MS得到错误...

Answer 6

我刚才遇到了同样的问题！

我安装了DevX IDE工具，卸载它似乎已经解决了我的问题。我几天前就这样做了，问题没有再发生。

Answer 7

我意识到这是一个较老的线程，但我仍有同样的问题

我还没有找到如何防止它，但有一种更容易的方法来纠正CSS混乱：

只要您注意到VS2010搞砸了CSS代码，请停止调试，转到CSS文件选项卡并按下撤消按钮。你的Css代码回到VS2010搞砸之前。编译并运行。

我很快就会试用VS2012，有人知道它是否已在那里解决了？

Visual Studio（2012及更低版本）删除CSS属性

7 个答案: