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

时间:2016-02-27 19:36:48

标签: css3 dreamweaver code-hinting

好的,我花了不少时间尝试研究插件和/或扩展,这些插件和/或扩展允许Dreamweaver提示未显示的CSS3的几个命令。

我在下面发布解决方案。

2 个答案:

答案 0 :(得分:1)

我要在XML中添加更多有用的行。其他人可能需要它。

与STEP 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>

与STEP 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" />

答案 1 :(得分:0)

我想出了一种方法,所以我将回答我自己的问题,但我认为对其他需要做同样事情的人也会有所帮助。我个人将展示如何添加所有&#34; flex&#34;在Windows计算机上的东西。

第1步 - 找到文件

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

第2步 - 允许访问CodeHints.xml

右键单击CodeHints.xml,然后单击安全选项卡。转到列表中的当前用户(通常为Users (You\Users)),并确保其已修改&#34;修改&#34;启用。如果没有,请单击“编辑”,在弹出窗口中选择当前用户并勾选“修改”,然后单击底部的“确定”,再次单击“安全”选项卡上的“确定”。

第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-*代码。

</menu>块的结束display:之后添加:

<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步 - 对您的代码提示工作感到高兴!

希望帮助那里的人。