前端emmet插件的一些常用用法
以下是在webstorm中简单使用emmet插件,注意一点就是当编写完emmet命令后一定要把光标移动到命令的结尾处,不然生成的代码会不一样
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--1.#box$*4-->
<div id="box1"></div>
<div id="box2"></div>
<div id="box3"></div>
<div id="box4"></div>
<!--2.div[attr='attr']-->
<!--div[attr='attr'][data-type='addText']-->
<div attr="attr" data-type="addText"></div>
<!--.box1[attr='attr']-->
<div class="box1" attr="attr"></div>
<!--3.div{content}-->
<!--.box{这是测试emmet的内容部分}-->
<div class="box">这是测试emmet的内容部分</div>
<!--4.布局;div>#header+#main+footer-->
<!--#container>(#header>ul>li*5>a)+(#main>#left+#right)+#footer-->
<div id="container">
<div id="header">
<ul>
<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>
<div id="main">
<div id="left"></div>
<div id="right"></div>
</div>
<div id="footer"></div>
</div>
</body>
</html>
前端emmet插件的一些常用用法的更多相关文章
- sublime课程3 emmet插件中的常用符号有哪些
sublime课程3 emmet插件中的常用符号有哪些 一.总结 一句话总结:emmet插件中的符号和css选择器里面哪些符号的意思很像. 1.+是干嘛的? 组合 2.{}是干嘛的? 标签里面的inn ...
- Emmet插件比较实用常用的写法
看了一些关于Emmet插件写法的文档,港真,怎么可以写这么长啊.其实知道几个大概要点加上实践基本就能上手写了啊 杂话 我前面有一篇[今天发现新大陆:haml和Emmet ],其实一开始的想法是写给自己 ...
- 【转】sublime text 2中Emmet插件8个常用的技巧
因为开始做web项目,所以最近在用sublime编辑器,知道了一个传说中的emmet,原名是zen coding.html神插件可以说是.文章部分内容转自http://www.cnblogs.com/ ...
- Sublime Text 2 安装emmet插件和常用快捷键
一.先安装package control1.按Ctrl+`调出console,输入以下命令然后回车 import urllib2,os; pf='Package Control.sublime-pac ...
- “一键”生成HTML——Emmet插件常用语法
Emmet是一款文本编辑器/IDE的插件,用来快速生成复杂的HTML代码,只要掌握一些常用的语法(类似于CSS选择器),就可以减少重复编码的工作(主要是懒).我个人惯用的是sublime,因此下文介绍 ...
- Emmet插件使用方法总结
Emmet插件使用方法总结 在前端开发的过程中,一大部分的工作是写 HTML.CSS 代码.特别是手动编写 HTML 代码的时候,效率会特别低下,因为需要敲打很多尖括号,而且很多标签都需要闭合标签等. ...
- Emmet插件详解
http://www.ithao123.cn/content-10512551.html (webstorm的css编写插件)Emmet:HTML/CSS代码快速编写神器 [摘要:Emmet的前身 ...
- sublime text3中emmet插件的使用
首先,想要快速编码需 要在编辑器中安装常用插件,下面是emmet插件的使用: html5文档结构的生成方式: 1).!+tab键 2).html:5 +tab键 头部head中meta字符集的生成: ...
- 【编程工具】Sublime Text3 之 Emmet 插件的详细使用的方法
这篇关于 Emmet 插件使用的博文之前就想写了,今天刚好闲暇时间,就花了一些时间进行了总结. 我们都这道 Emmet 这款插件在前端设计里被称为神器,确实,神器称号名不虚传.因为这款插件可以帮助我们 ...
随机推荐
- MySQL语句基础
该笔记使用的数据库为MySQL-5.6.34,使用的建表语句为 : /* Navicat MySQL Data Transfer Source Server : 127.0.0.1 Source Se ...
- JavaScript 用new创建对象的过程
在JavaScript中创建自定义对象都需要用new运算符,那么创建对象的过程是什么样的呢? 例如现在有如下构造函数: function Person(name) { this.name = n ...
- “全栈2019”Java第六十章:如何定义接口
难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...
- 2017qcon大会的一点想法(安全人才如何不被淘汰?)
2017 qcon 上海专门设立了“直击黑产,业务安全的攻与防”专题,通过这次专题的了解和学习,让我对黑产的攻防有了更深入认识. 1. 安全防护趋势 2017 qcon 上海专门设立了“直击黑产,业务 ...
- MySQL直接导出CSV文件,并解决中文乱码的问题
需求: 需要导出hr_users 表中的部分字段的数据,以前是用PHP写脚本,然后导出CSV文件. 在MySQL中,它自己就能导出CSV文件 ,只不过是有如下几个问题需要大家解决. 1. 生成文件不成 ...
- Mysql创建、删除用户[转]
MySql中添加用户,新建数据库,用户授权,删除用户,修改密码(注意每行后边都跟个;表示一个命令语句结束): 1.新建用户 登录MYSQL: @>mysql -u root -p @>密码 ...
- 树莓派 Raspbian
备注,从右往左分别是:无线鼠标一个, HDMI转VGA接口一个,网线一根,小米充电宝电源线一个.树莓派Pi 3 一台,包括读卡器一个+32G class10 SD卡一块.最后俩个U盘作为备用里面有Ar ...
- Java学习--多态
1. 多态 多态:同一个对象(实物),在不同时刻体现出来的不同状态 多态的前提: A:要有继承关系 B:要有方法重写 C:要有父类引用指向子类对象 父类 f = new 子类() 多态中的成员访问特点 ...
- iOS 之NSOperation(一)
一.NSOperation的介绍 1.NSOperation的作用 配合使用NSOperation和NSOperationQueue实现多线程编程 2.实现多线程的具体步骤 1)将需要执行的操作封装到 ...
- TX2 五种功耗模式
工作模式介绍 Jetson TX2由一个GPU和一个CPU集群组成,CPU集群由双核丹佛2处理器和四核ARM Cortex-A57组成,通过高性能互连架构连接. 拥有6个CPU核心和一个GPU,您可以 ...