我已经使用CSS多年了，毫无疑问，它在将表示责任与HTML分离到一个单独的规范层中具有巨大的价值。
但是，我发现自己正要通过直接编码CSS规则进行复杂的布局和设计工作而感到不对。感觉好像抽象层次不匹配，并且位于CSS之上的工具将具有很大的价值，它允许您在更高的层次上使用并指定布局和设计。
规范
我正在寻找的是一种通过使设计人员在布局和设计方面针对更高层次的意图和规范来管理HTML表示和布局的工具，并且该工具会自动生成适当的CSS和可能是特定于布局的JavaScript来解决设计者的意图。
有点像讨厌的所见即所得（WYSIWYG）编辑器，我们有时在2000年初左右或无论何时使用，但只专注于在设计和布局上。拖放元素。绑定到网格。将元素彼此绑定。管理和可视化语义和文体元素的关系及其分配。依此类推。
当然，该工具需要与常规开发过程兼容，例如在Visual Studio中开发常规.NET ASP MVC应用程序的情况下，然后转向此方法。工具来处理内容的布局和样式。当然，我们认为将两者完全去耦是可能的，这是愚蠢的，但是这种耦合至少是清楚和可管理的。 （当然，该工具理论上可以是VS或其他IDE的扩展-解决了这类问题，但可能会使整个环境更加复杂。）
因此，该工具的实现可能是相当广泛，我认为这里的核心功能是：
提供有关Web应用程序（或任何图形系统，如果需要哲学的话）的设计和布局的更高抽象性。
提供一个GUI，可以有效地使设计者表达其样式和翻译意图规范转换为“可执行的” CSS（/ JS）。
仅关注Web应用程序的布局和样式，并与我们用于实现Web应用程序后端部分的常规工作流和工具一起良好工作。 />
是否存在与我描述的工具类似的任何工具？
任何操作系统都很有趣，但Windows会最方便。
#1 楼
新的WYSIWYG编辑器适用于模型设计和初始设计。不适合在现有应用程序上使用。
金刚鹦鹉，素描，Pinegrow甚至Photoshop +括号
✔提供有关Web应用程序的设计和布局
✔提供一个GUI，可以有效地使设计人员
表达其设计意图
✔将此规范翻译为“可执行文件” “ css（/ js）
✔仅关注布局和样式
✘与我们正常的工作流程配合良好
那些软件很适合最初的模型和设计。
，但是，使用现有的应用程序（即导入html，表达样式和导出更改）不能很好地工作。
不幸的是，它们与所见即所得的编辑器存在相同的问题：他们可以导入自行生成的代码，但是它们对处理第三方代码或修改后的代码很不利。
用于Web开发的IDE
Web集成的理想选择使用任何工作流程。并要求设计人员编写代码
TweakStyle，Espresso，Brackets，Dreamweaver，...
（还有很多其他代码。我选择列出四个，因为它们提供实时预览。）
✘提供有关Web应用程序的设计和布局的更高抽象性
✘提供一个可以有效地使设计者表达其设计意图的GUI
✔将此规范转换为“可执行” css（/ js）
✔仅关注布局和
样式
✔与我们的常规工作流程完美配合
代码编辑器具有用于前端和Web设计的有用工具，例如实时预览或Override（TweakStyle和Espresso ）。它们可能会与您的工作流程很好地配合使用，但可能缺乏抽象来让设计师思考，并且可能会有些设计师使用某些技术。
最好的解决方案可能是使用绘图工具来思考设计（Photoshop，Gimp或只是纸和笔）。然后
使用以下一种IDE将其应用于现有应用程序
Disclamer：我是TweakStyle的创建者
关于您的需求，您可能会对TweakStyle的Override功能感兴趣。它允许在远程后端上导航，同时预览对静态资源所做的更改。同样，它在sass和更少的环境下也可以正常工作。
随时在评论中添加指向其他软件的链接
评论
您是否尝试过Expression Web？由于您使用的是Visual Studio，如果我是对的，则Expression Web与Visual Studio可以很好地集成。@scubaFun感谢您的建议，但这似乎只是一个普通的Web开发IDE-像VS一样，但功能更轻巧，并且更多地面向前端。我正在寻找一种在布局和设计中引入新的高级抽象的工具，使用户可以有效地使用它们来定义Web应用程序中内容的样式和布局，然后自动生成适当的CSS和可能的样式/布局集中的javascript。我一点都看不到。
哦，对不起。我以前使用过Expression Blend，关于高级抽象，这正是您要的。但是Expression Blend适用于WPF和Silverlight应用程序，不适用于Web开发。我以为Expression Web与用于Web应用程序的Expression Blend相同。
@scubaFun Web混合肯定听起来很美，让我们希望像这样的事情在我们光荣的一天之中成为现实。
尽管我自己还没有使用过Adobe Edge Reflow听起来很相似。