如何将 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" />
好吧,我花了很多时间尝试研究插件 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" />