如何将 CSS3 元素添加到 DW CS6 代码提示

How to Add CSS3 Elements to DW CS6 Code Hints

好吧,我花了很多时间尝试研究插件 and/or 扩展,这些扩展允许 Dreamweaver 提示未显示的 CSS3 的几个命令。

我在下面发布解决方案。

我想出了一个方法,所以我会回答我自己的问题,但我认为这对需要做同样事情的其他人会有帮助。我个人将展示如何在 windows 计算机上添加所有 "flex" 内容。

第 1 步 - 找到文件

使用文件资源管理器导航到; /Program Files/Adobe/Adobe Dreamweaver CS6/configuration/CodeHints/ 它可能在 /Program Files (x86)/ 文件夹中。

第 2 步 - 允许访问 CodeHints.xml

右键单击 CodeHints.xml,然后单击“安全”选项卡。转到列表中的当前用户(通常是 Users (You\Users))并确保它已启用 "modify"。如果不是,请单击编辑,select 弹出窗口中的当前用户并勾选修改,然后单击底部的确定,然后再次单击安全选项卡上的确定。

第 3 步 - 在 CodeHints.xml

中添加 flex 作为 display: 选项

使用可以编辑 XML 的编辑器,例如 Sublime、Dreamweaver 或任何文本编辑器并搜索 display: - 确保在搜索中添加冒号。

会有两个结果,你想要第一个开始<menu pattern="display:"

在打开和关闭之间的任意位置添加<menuitem label="flex" value="flex" icon="shared/mm/images/hintMisc.gif" />的新菜单项

第 4 步 - 添加 flex-* 标签。

在那个 display: 块的关闭 </menu> 之后添加:

<menu pattern="flex-wrap:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="nowrap" value="nowrap" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="wrap" value="wrap" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="wrap-reverse" value="wrap-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="flex-shrink:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="flex-basis:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="auto" value="auto" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="flex-grow:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="flex-direction:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="row" value="row" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="row-reverse" value="row-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="column" value="column" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="column-reverse" value="column-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="flex-flow:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="row" value="row" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="row-reverse" value="row-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="column" value="column" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="column-reverse" value="column-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="nowrap" value="nowrap" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="wrap" value="wrap" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="wrap-reverse" value="wrap-reverse" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="initial" value="initial" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="inherit" value="inherit" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>

第 5 步 - 将这些标签添加到提示列表中。

再次搜索 display: 并找到第二个类似这样的 <menuitem label="display" value="display:" icon="shared/mm/images/hintMisc.gif" />

在该条目下方添加:

<menuitem label="flex-wrap" value="flex-wrap:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="flex-basis" value="flex-basis:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="flex-direction" value="flex-direction:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="flex-flow" value="flex-flow:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="flex-grow" value="flex-grow:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="flex-shrink" value="flex-shrink:" icon="shared/mm/images/hintMisc.gif" />

再次确保图标路径与其他图标路径匹配。

第 6 步 - 保存并重新启动 Dreamweaver。

第 7 步 - 祝您代码提示有效!

希望对外面的人有所帮助。

我正在向 XML 添加一些更有用的行。其他人可能需要它。

如第 4 步添加:

<menu pattern="justify-content:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="flex-start" value="flex-start" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="flex-end" value="flex-end" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="center" value="center" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="space-between" value="space-between" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="space-around" value="space-around" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="align-items:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="flex-start" value="flex-start" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="flex-end" value="flex-end" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="center" value="center" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="baseline" value="baseline" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="stretch" value="stretch" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>
<menu pattern="align-content:" additionaldismisschars=";:" allowwhitespaceprefix="true" displayrestriction="css" allowmultiplevalues="true">
  <menuitem label="flex-start" value="flex-start" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="flex-end" value="flex-end" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="center" value="center" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="space-between" value="space-between" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="space-around" value="space-around" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="stretch" value="stretch" icon="shared/mm/images/hintMisc.gif" />
  <menuitem label="!important" value="!important" icon="shared/mm/images/hintFlag.gif" />
</menu>

如第 5 步添加:

<menuitem label="justify-content" value="justify-content:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="align-items" value="align-items:" icon="shared/mm/images/hintMisc.gif" />
<menuitem label="align-content" value="align-content:" icon="shared/mm/images/hintMisc.gif" />