Eclipse 中 CSS 类 HTML JavaScript jQuery 中的自动完成 von 可用

Autocomplete von available CSS classes in HTML JavaScript jQuery in Eclipse

我使用的是最新的 Eclipse 版本。现在我正在使用 Javascript、jQuery、HTML 和 CSS 进行编码。对于我在 CSS 中定义的 classes,如何显示在 HTML 中显示的自动完成(显示在 CSS 中定义的所有可用 classes)?

我的 CSS 文件中有一个名为 "display" 的 class。

file.css:

.display {
background:green;
}

如何使用 自动完成 获得建议的显示 class?

HTML:

我需要什么样的plug-in/addon?

打开 Web 项目的“属性”对话框,您可以在“Web 内容设置”页面上更改该项目的默认 CSS 配置文件。如果 CSS 文件不在您的 Web 项目中,或者如果您不想使用项目默认值,您也可以使用文件的属性对话框(也是 Web 内容设置页面)进行设置。然后它将工作。

因为 Eclipse 不是基于文件的。它基于项目。

与 Eclipse 安装捆绑在一起的默认 WTP 插件不支持此功能。您将必须安装扩展插件 (WTP Web resources)。

转到帮助 -> 安装新软件并在 'Work with' 文本框中添加以下内容 URL 并按添加。

http://oss.opensagres.fr/eclipse-wtp-webresources/1.1.0/

稍后,您会看到一份核对清单。检查插件并单击安装。

安装完成后,重启Eclipse。然后打开一个 HTML 文件并将 link 添加到 CSS 文件,如下例所示:

sample.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="test.css" />
</head>
<body >




</body>
</html>

sample.css

.one { padding: 10px; } 
.two { padding: 20px; }

现在在 HTML 文件的正文中添加一个元素 - 例如div - 并添加 class="" 属性。在双引号内按 Ctrl+Space 将调出内容帮助 window,显示 linked CSS 文件中所有可用的 classes。