【翻译】CodeMix使用的语言和框架(六):HTML5

CodeMix插件显著增强了Eclipse在HTML5开发中的功能,提供了内容辅助、CSSIntelliSense、Emmet支持、片段、验证及格式化等特性,与未安装CodeMix的Eclipse相比,能极大提高编码效率和用户体验。

使用CodeMix在Eclipse中启动HTML5
带有CodeMix的Eclipse中的HTML5
在这里插入图片描述
CodeMix是一个插件,它将VS Code智能引入Eclipse,并允许您直接从Eclipse访问Code OSS扩展。 使用CodeMix,您可以获得在Eclipse中使用HTML5时获得卓越编程体验所需的一切。

内容辅助

CSS IntelliSense
Emmet表达支持
片段
验证
格式化
没有CodeMix的Eclipse中的HTML5
在这里插入图片描述
没有CodeMix的Eclipse不包含高效编码所需的工具。 即使您下载获得这些功能所需的各种Eclipse插件,结果也不会接近CodeMix提供的丰富用户体验。

CodeMix包含一个Web扩展包,可自动下载和管理您获得最佳HTML5和CSS3编码体验所需的一切。

通过CodeMix了解有关HTML5的更多信息
通过CodeMix了解有关CSS3的更多信息
详细信息
内容辅助
键入时会显示建议 - 您无需专门调用内容辅助。对于大多数CodeMix编辑器来说都是如此,一旦习惯了这一点,您就不会想要回到“Eclipse方式”。 CodeMix HTML编辑器始终位于HTML5规范之上,确保您为元素和属性提供高质量的内容辅助。附带建议的文档相当详细,在处理相对不常见和较新的元素(例如模板)时尤其方便。

CSS IntelliSense
CSS类名称的内容辅助是一个巨大的节省时间!由于CodeMix Web扩展包中包含IntelliSense for CSS扩展,您无需跳转到样式表和定义即可找到所需的类。而且,通过在CodeMix中选择首选项,可以轻松定制IntelliSense以满足您的需求。

片段
Eclipse也有片段/模板,但很少有开箱即用的定义,插件也不会添加它们。 CodeMix使用Bootstrap 4片段,有数百个扩展有助于Bootstrap。如果您发现自己广泛使用其他框架,那么您也可能会找到这些框架的代码段扩展。

Emmet
使用HTML时,Emmet非常方便。 Emmet表达式可以为您节省大量的内容,而使用Emmet命令可以做更多的事情。 Emmet提供各种功能和设置,真正加快编码速度。
在这里插入图片描述

HTML验证
你有没有弄乱布局,因为你没有关闭标签? 或者,您可能对多个元素使用相同的ID? Eclipse不包含内置的HTML验证,因此找到像这样的错误真的很痛苦。 但是由于HTML Hint扩展,您现在可以在Eclipse中使用CodeMix进行可配置的HTML验证。
在这里插入图片描述

格式化
看看CodeMix的格式是多么令人印象深刻。 第一个例子展示了Eclipse格式化程序可以做什么 - 不是太令人印象深刻。 现在看一下显示CodeMix体验的第二个示例 - 注意代码的清晰度和可读性。 CodeMix使用Beautify扩展格式化HTML,该扩展包含在CodeMix Web扩展包中。 此扩展程序提供了许多功能和设置,供您自定义体验。

在没有CodeMix的Eclipse中进行格式化
在这里插入图片描述
在有CodeMix的Eclipse中进行格式化
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值