blocks|key|850653|text|火虫是一个非常好的火狐扩展，它允许您检查文档树中哪些DOM元素是活动的。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|850654|虽然它没有提出任何改进的建议，但是当手工调试/简化CSS代码时，这是一个很大的帮助。|850655|Web开发人员扩展也是一个很大的帮助。|850656|entityMap|0|LINK|mutability|MUTABLE|url|http://getfirebug.com/|1|http://chrispederick.com/work/web-developer/^0|0|2|0|0|0|0|7|1|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@$A|S|B|T|1|U]]|C|$]]|$1|D|3|E|5|6|7|V|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|W|8|@]|9|@$A|X|B|Y|1|Z]]|C|$]]|$1|H|3|-4|5|6|7|10|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]|P|$5|K|L|M|C|$N|Q]]]]

<a href="http://getfirebug.com/" rel="nofollow noreferrer">Firebug</a> is a very good Firefox extension that allows you to examine which CSS declarations are active for which DOM element in your document tree.

Although it does not make any suggestions for improvements, it's a great help when debugging/simplifying CSS code by hand.

The <a href="http://chrispederick.com/work/web-developer/" rel="nofollow noreferrer">Web Developer</a> extension is also a great help.

blocks|key|846550|text|TopStyle很受欢迎，而且一直是我听说推荐的。它有关于风格等的建议。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|846551|我使用阿普塔纳，但这不会进行重构，只会标记错误并允许您针对特定的浏览器。使用这个，一本不错的CSS书籍可能会有所帮助。|846552|entityMap|0|LINK|mutability|MUTABLE|url|http://www.newsgator.com/Individuals/TopStyle/Default.aspx|1|http://www.aptana.com/^0|0|8|0|0|3|4|1|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|F|3|-4|5|6|7|X|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]|N|$5|I|J|K|C|$L|O]]]]

<a href="http://www.newsgator.com/Individuals/TopStyle/Default.aspx" rel="nofollow noreferrer">TopStyle</a> is popular and always the one I hear recommended. It has recommendations on styles etc.

I use <a href="http://www.aptana.com/" rel="nofollow noreferrer">Aptana</a> but this doesn't do an refactoring just flags up errors and allows you to target certain browsers. Using this a a decent CSS book may help.

blocks|key|167756|text|如果您使用的是ASP.NET+2.0，就会有ReFactor！对于ASP.NET|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|167757|entityMap|0|LINK|mutability|MUTABLE|url|http://www.devexpress.com/Products/Visual_Studio_Add-in/RefactorASP/^0|M|I|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

If you're using ASP.NET 2.0, there's <a href="http://www.devexpress.com/Products/Visual_Studio_Add-in/RefactorASP/" rel="nofollow noreferrer">ReFactor! for ASP.NET</a>

blocks|key|850677|text|我喜欢Expression的CSS工具。但是，它对于最小化或统一CSS并没有多大作用。您必须了解CSS如何正确地使用它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|850678|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I like Expression Web's CSS facilities. But it doesn't do much for minimizing or unifying your CSS. You have to understand how CSS works to use it properly.

blocks|key|846585|text|灰尘-我选择器火狐扩展可以扫描一个网站，告诉你哪些是使用的，哪些不是。删除未使用的CSS是重构的第一步。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|846586|我经常发现，当某个部分从网站中删除时，HTML就会被删除，而CSS则不会被删除。|846587|entityMap|0|LINK|mutability|MUTABLE|url|https://addons.mozilla.org/en-US/firefox/addon/5392^0|0|B|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

The <a href="https://addons.mozilla.org/en-US/firefox/addon/5392" rel="noreferrer">Dust-Me Selectors Firefox extension</a> can scan a website and tell you what CSS is used and what is not. Removing unused CSS is one good first step in refactoring.

I have often found that when some section is removed from a website, the HTML is removed but the CSS is not.

blocks|key|850706|text|火狐的EditCSS是惊人的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|850707|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

blocks|key|167817|text|在过去，我很幸运地使用施蒂利泽。它更好，只需TopStyle的1/6。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|167818|entityMap|0|LINK|mutability|MUTABLE|url|http://www.skybound.ca/stylizer/^0|B|4|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

I've had good luck using <a href="http://www.skybound.ca/stylizer/" rel="nofollow noreferrer">Stylizer</a> in the past. It's nicer and only costs 1/6 of TopStyle.

blocks|key|846619|text|我曾经使用WestCiv的StyleMaster，这是一个非常好的CSS编辑器/检查器/调试器应用程序。将这一点与前面提到的Firebug结合起来，您就会情不自禁地保持在CSS上。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|846620|entityMap|0|LINK|mutability|MUTABLE|url|http://www.westciv.com/style_master/index.html^0|D|B|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

I used to use WestCiv's <a href="http://www.westciv.com/style_master/index.html" rel="nofollow noreferrer">StyleMaster</a>, which is a pretty good CSS editor / inspector / debugger app. Combine that with the afforementioned Firebug, and you can't help but stay on top of your CSS.

blocks|key|1166817|text|此站点至少有助于对规则进行排序和最小化：http://www.cleancss.com/|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1166818|这并不能把你带到你想去的地方，但这是一个很好的第一步。|1166819|entityMap|0|LINK|mutability|MUTABLE|url|http://www.cleancss.com/^0|K|O|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

This site at least helps to sort and minimize your rules: <a href="http://www.cleancss.com/" rel="nofollow noreferrer">http://www.cleancss.com/</a> 
It doesn't get you to where you want to be, but it's a good first step.

blocks|key|167880|text|也许CssTidy或CssOptimiser可以帮助清理和缩小。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|167881|entityMap|0|LINK|mutability|MUTABLE|url|http://floele.flyspray.org/csstidy/css_optimiser.php|1|http://www.cssoptimiser.com/^0|2|7|0|A|C|1|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]|$A|R|B|S|1|T]]|C|$]]|$1|D|3|-4|5|6|7|U|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]|L|$5|G|H|I|C|$J|M]]]]

Maybe <a href="http://floele.flyspray.org/csstidy/css_optimiser.php" rel="nofollow noreferrer">CssTidy</a> or <a href="http://www.cssoptimiser.com/" rel="nofollow noreferrer">CssOptimiser</a> can help to clean-up and make smaller

blocks|key|850751|text|有一个名为HAML的Ruby，它附带了一个名为css2sass的可执行文件。该可执行文件将CSS转换为沙斯，这是CSS之上的一种元语言，它使重构变得更加容易(通过更好地说明选择器之间的关系)。也许值得一看。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|850752|entityMap|0|LINK|mutability|MUTABLE|url|http://haml.hamptoncatlin.com/docs/rdoc/classes/Sass.html^0|1F|2|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

There's a Ruby gem called HAML that ships with an executable called css2sass. That executable translates CSS into <a href="http://haml.hamptoncatlin.com/docs/rdoc/classes/Sass.html" rel="nofollow noreferrer">SASS</a>, which is a metalanguage on top of CSS that makes it much easier to refactor (by better illustrating the relationships among your selectors). Might be worth taking a look.

blocks|key|1166873|text|我试着和较少用于.NET玩。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1166874|entityMap|0|LINK|mutability|MUTABLE|url|http://www.dotlesscss.com/^0|4|8|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

My attempt at playing around with <a href="http://www.dotlesscss.com" rel="nofollow noreferrer">Less for .NET</a>.

blocks|key|846669|text|我可能会晚一点，但ReSharper+6早期访问预览(EAP)为您做了这一点！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|846670|在CSS文件中，输入"#“将自动完成项目中的每个ID。句点也一样“。列出你所有的课程。|846671|最棒的部分:当您重命名选择器时，它将在整个项目范围内重命名它。它使CSS重构速度更快，即使不是令人愉快的。|846672|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

I might be a little late but the ReSharper 6 early access preview (EAP) does this for you!

In a CSS file, entering "#" will auto-complete every ID from your project. Same with a period "." to list all your classes. 

Best part: when you rename the selector it will rename it project-wide. It makes refactoring CSS much faster, if not pleasurable.

I am working with some CSS that is poorly written to say the least. I am not a design/CSS expert, but I at least understand the C in CSS. While the builtin CSS support inside of VS-2008 is far improved over previous versions, it still doesn't quite do what I am looking for.

I was wondering if anyone know of a good program or utility that will help me to refactor and clean up my CSS like what ReSharper allows to do with C#.

Some features that would be nice to have:

<ul>
<li>Examine CSS files and determine ways to extract common styles like font-style, color, etc... </li>
<li>Plugin to VS-2008 would be awesome!</li>
<li>Examine markup files and make some suggestions on improving the current use of classes and styles.</li>
</ul>

Are there any utilites that will help me refactor CSS

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正在使用一些CSS，至少可以说，这些CSS编写得很糟糕。我不是设计/ CSS专家，但我至少了解CSS中的C。尽管VS-2008内部的内置CSS支持比以前的版本有了很大的改进，但它仍然没有完成我想要的。我想知道是否有人知道一个好的程序或实用程序，可以帮助我像ReSharper允许的那样重构和清理我的CSS。有些功能很好...

问有什么实用工具可以帮助我重构CSS吗？
EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问有什么实用工具可以帮助我重构CSS吗？EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问有什么实用工具可以帮助我重构CSS吗？
EN