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. linux安装中文输入法

    CentOS英文系统安装中文输入法,简单说说在CentOS 6.3下用yum安装中文输入法的过程.   1.需要root权限,所以要用root登录 ,或su root 2.yum install &q ...

  2. git 误删分支恢复方法

    在使用Git的过程中,因为人为因素造成分支(commit)被删除,可以使用以下步骤进行恢复. 首先用以下步骤创建一个新分支,修改一些文件后删除,以便进行恢复. 1.创建分支 abc git branc ...

  3. Xamarin Mono Android实现“再按一次退出程序”

    开始研究Android平台软件编程,Xamarin Mono for Android上手快,跨平台共享代码,代价是bug多多,是一味可口的毒药啊! 环境VS2012 + Xamarin Mono An ...

  4. Java实现五子棋

    代码: package com.hotusm.datastructure.list; import com.hotusm.datastructure.Log; /** * @author luqiba ...

  5. eclipse无法连接到makertplace

    Eclipse需要安装一个Jcoco的插件,但是连接Eclipse Market的时候,总是出现如下的报错: Cannot open Eclipse Marketplace Cannot instal ...

  6. Redmine发布新闻，自动发送邮件功能失效恢复

    问题描述:操作数据库,修改项目公开状体后,创建新闻,自动发送邮件功能失效. 问题检查和恢复测试: 1.检查管理员权限 2.重新手动配置项目公开状态,覆盖数据操作 3.对比其他正常项目数据库状态,进行恢 ...

  7. cordova 企业应用打包Archive的时候报 "#import <Cordova file not found"

    可能原因是Cordova的路径问题: For xcode7 add "$(OBJROOT)/UninstalledProducts/$(PLATFORM_NAME)/include" ...

  8. EF中的预先加载和延迟加载

    延迟加载(Lazy Loading):当实体第一次被读取时,相关数据不会被获取,只会读取本身.延迟加载的数据不会一次性查出来,而是一条一条的查询,这样就会多次请求数据库进行查询. 预先加载<Ea ...

  9. Flask web开发之路十四

    今天开始Flask的实战,创建一个项目,实现包括用户登录.注册.注销.发表博客.评论以及检索等功能 首先给出项目结构: 1.config.py文件: 存放各种配置信息 import os # dial ...

  10. Flask web开发之路二

    今天创建第一个flask项目,主app文件代码如下: # 从flask这个框架导入Flask这个类 from flask import Flask #初始化一个Flask对象 # Flasks() # ...