zen coding是一种编写html和css的方法, 很快捷.

打开Views/Home/About.cshtml, 然后在空白处输入div然后按Tab:

随后完整的div标签就出来了:

zen coding允许你使用css选择器进行更复杂的结构化写法, 例如输入 div>p>ul>li:

然后立即按Tab, 就会出现下列代码:

如果想重复5个li, 那么输入 div>p>ul>li*5:

如果想加上class属性, div>p>ul.list-group>li.list-group-item*5:

一个建立bootstrap form的例子,

form>(.form-group>label+input.form-control)*4+.form-group>input[type=submit].form-control

就会生成下面的form:

其中+表示下一个元素中括号可以写其他属性.

VS Code Html Zen coding的更多相关文章

  1. 前端代码新写法——Zen Coding

    是不是还在为html繁琐的标签写法而苦恼? 是不是还在枯燥的写尖括号? Zen Coding的到来将让前端编码不在繁琐.不再拘泥html的尖括号和一堆一堆的标签. 先看看ZenCoding的效果图. ...

  2. 使用Zen coding高效编写html代码

    zen-Coding是一款快速编写HTML,CSS(或其他格式化语言)代码的编辑器插件,这个插件可以用缩写方式完成大量重复的编码工作,是web前端从业者的利器. zen-Coding插件支持多种编辑器 ...

  3. Zen Coding support in WebStorm/PhpStorm

    With the last WebStorm/PhpStorm EAP you can edit HTML and CSS code really fast usingZen Coding featu ...

  4. zen coding

    zen-Coding是一款快速编写HTML,CSS(或其他格式化语言)代码的编辑器插件,这个插件可以用缩写方式完成大量重复的编码工作,是web前端从业者的利器. zen-Coding插件支持多种编辑器 ...

  5. Notepad++ 安装 Zen Coding / Emmet 插件

    Zen Coding 插件 ============== 下载: Zen.Coding-Notepad++.v0.7.zip ==Installation== 1. Copy contents of ...

  6. 使用 Code Snippet 简化 Coding

    在开发的项目的时候,你是否经常遇到需要重复编写一些类似的代码,比如是否经常会使用 for.foreach ? 在编写这两个循环语句的时候,你是一个字符一个字符敲还是使用 Visual Studio 提 ...

  7. vim 中 也可以 直接安装 emmet 直接使用zen coding 生成 l指定个数的 lorem ipsum文字.

    超链接的写法: 当作为链接的文字, 比较长时, 整个作为链接 就显得不是 很适合. 可以取其中的某一个单词 作为 超链接的 关键字:如: click here to continue emmet中如何 ...

  8. 再说vundle:　完全vim字符编程的四个必须插件 - zen coding 和emmet插件的使用

    一个常识: 基本上vim插件的配置文集都是放在对应插件目录 的/autoload/ plugin_name.vim 文件中的 有四个必要/必须的插件,实现vim完全的字符界面的编程: NERDTree ...

  9. zen coding和emmet

    zen coding 改名为 emmet http://emmet.io/download/

随机推荐

  1. 基于Java的数据采集（一）

    之前写过2篇关于PHP数据采集入库的文章: 基于PHP数据采集入库(一):http://www.cnblogs.com/lichenwei/p/3872307.html 基于PHP数据采集入库(二): ...

  2. 通信原理之TCP/IP基本概念 （二）

    本来想写写,但发现有人写的很好了,不造轮子了!  直接转了 一.为什么会有TCP/IP协议 在世界上各地,各种各样的电脑运行着各自不同的操作系统为大家服务,这些电脑在表达同一种信息的时候所使用的方法是 ...

  3. iOS 判断App启动方式

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launc ...

  4. Excel 保护工作表

    1.选取整张表格,格式--设置单元格格式--锁定状态 2.将用户可编辑区域解锁 3.在审阅--保护工资表,设置除第一行不选,其他全选,添加密码保护,确定

  5. win2008在组件服务中未找到office组件服务

    在win2003系统,cmd中输入 dcomcnfg ,组件服务里面找到office的组件服务,但win2008 R2 64位操作系统需要输入comexp.msc -32 tks:http://www ...

  6. Phoenix系列：原子的Upsert

    Phoenix的插入语句是Upsert,Update和Insert的组合语义.即,如果数据表中没有这条记录那么插入这条记录,如果有则更新.判断是否存在相同的数据是使用ON DUPLICATE KEY来 ...

  7. 如何利用office绘制施工进度计划横道图？

    在Excel中利用“悬浮的条形图”可以制作简单的横道图.Step1 启动Excel,仿照图1的格式,制作一份表格,并将有关工序名称.开(完)工时间和工程持续时间等数据填入表格中. A1单元格中请不要输 ...

  8. spark on yarn 无法提交任务问题

    java.lang.NoClassDefFoundError: com/sun/jersey/api/client/config/ClientConfig spark任务提交出错. 原因: spark ...

  9. Django----From组件

    Django的Form主要具有一下几大功能: 生成HTML标签 验证用户数据(显示错误信息) HTML Form提交保留上次提交数据 初始化页面显示内容 1.创建Form类 from django.f ...

  10. 微信token验证失败的几种情况

    最近在研究用PHP做微信开发的时候,“修改配置时”,总是遇到token验证失败的提示.历经一番查找,种种输出日志和echo,发现,如果不echo调试信息,也不写日志,就不需要ob_clean(),如果 ...