发现一个特给力的编写HTML/CSS的插件——Zen Coding
这不是一个新东西,但它确实是个好东西。只能说我OUT了,这小插件还是在别人博客上一年前的日志里看到的,先来个链接吧,写的已经很详细了,我这里只是给自己做个记录,留给自己看的。(Zen Coding: 一种快速编写HTML/CSS代码的方法)
那Zen Coding到底是什么,又是如何使用的呢?我们看一下官方举的例子吧,如果你输入:
div #page>div.logo+ul#navigation>li*5>a |
就会看到这样的输出:
< div id="page"> < div class="logo"></ div > < ul id="navigation"> < li >< a href=""></ a ></ li > < li >< a href=""></ a ></ li > < li >< a href=""></ a ></ li > < li >< a href=""></ a ></ li > < li >< a href=""></ a ></ li > </ ul > </ div > |
有点看不懂了吧?那我们再来看个视频,不过有点模糊。
实际上,Zen Coding就是把长代码用短代码代替,而短代码会自动生成需要的长代码。说的有点白话,不过这样应该能理解。
Zen Coding支持很多ide,你可以去网站上找适合你的插件。
表达能力实在欠缺,我还是留2个链接给自己存档吧:CSS和HTML缩写和片段
总的来说,Zen Coding能大大减少我们在css和html上的编码时间,但高效的写法还是需要一定的练习才能掌握,如果你也喜欢,不妨试一试。
新博客地址
hooray.github.io
hooray.github.io
分类:
前端技术
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构