常用的ement语法
先来介绍一下什么是Emmet语法——就是使用类似于 CSS 选择器的语法描述元素在生成的文档树中的位置及其属性。
缩写语法:
快速生成html模板:
在HBuilder空白的HTML页面 使用html:5 或者直接使用 !在按Tab键
html:5
将生成:
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<!--code-->
</body>
</html>
使用元素名称生成html标签:
输入元素标签:例如 div 标签然后按下Tab键
div
将生成:
<div></div>
常见的CSS样式:
输入常用的css样式:例如:w120然后按下Tab键
w120
将生成:
width: 120px;
定义class 和 ID:
输入 标签名 .class名:例如:我要生成一个div class名为header的标签 div.header按下Tab
div.header
将生成:
<div class="header"></div>
嵌套:嵌套运算符用于在生成的树中定位缩写元素:是否应将其放置在context元素的内部或附近(摘自Emmet文档)。
子:> 使用运算符将元素嵌套在彼此内 例如:div>ul>li>a 按下Tab
div>ul>li>a
将生成:
<div>
<ul>
<li><a href=""></a></li>
</ul>
</div>
兄弟:+ 生成同级关系的元素 例如:div+p+span按下Tab标签
div+p+span
将生成:
<div></div>
<p></p>
<span></span>
生成重复的元素:* 使用 * 可以生成重复的元素 例如:li*10按下Tab标签
li*10
将生成:
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
文本: 使用 { } 把想要写的文本放入里面 例如:a{ 山不在高有仙则名 }按下Tab
a{山不在高有仙则名}
将生成:
<a href="">山不在高有仙则名</a>
组合:使用括号()内容对复杂缩写中的子树进行分组 例如:
div>(header>ul>li*2)+footer
将生成:
<div>
<header>
<ul>
<li></li>
<li></li>
</ul>
</header>
<footer></footer>
</div>
常用的ement语法的更多相关文章
- linux下常用语言的语法检查插件整理
linux下常用语言的语法检查插件 可以结合vim语法检查插件syntastic使用,具体请参考syntastic使用说明 如php,sql,json,css,js,html,shell,c等语法插件 ...
- Freemaker FTL指令常用标签及语法
https://blog.csdn.net/pengpengpeng85/article/details/52070602 FTL指令常用标签及语法 注意:使用freemaker,要求所有标签必须闭合 ...
- re 模块 常用正则表达式符号 最常用的匹配语法
常用正则表达式符号1 '.' 默认匹配除\n之外的任意一个字符,若指定flag DOTALL,则匹配任意字符,包括换行 '^' 匹配字符开头,若指定flags MULTILINE, ...
- update中加入select最常用的update语法
update中加入select最常用的update语法 (转) (2010-08-20 11:40:16) 转载▼ 标签: it 分类: SQL 最常用的update语法是:UPDATE <ta ...
- 【知识库】-数据库_MySQL常用SQL语句语法大全示例
简书作者:seay 文章出处: 关系数据库常用SQL语句语法大全 Learn [已经过测试校验] 一.创建数据库 二.创建表 三.删除表 四.清空表 五.修改表 六.SQL查询语句 七.SQL插入语句 ...
- FTL指令常用标签及语法
FTL指令常用标签及语法注意:使用freemaker,要求所有标签必须闭合,否则会导致freemaker无法解析. freemaker注释:<#-- 注释内容 -->格式部分,不会输出 - ...
- grep,awk和sed的常用命令和语法
Grep的常用命令语法 1. 双引号引用和单引号引用在g r e p命令中输入字符串参数时,最好将其用双引号括起来.例如:“m y s t r i n g”.这样做有两个原因,一是以防被误解为 s h ...
- Wireshark常用快捷键&&过滤器语法
目录 一.快捷键 二.过滤器语法 1.捕获过滤器的BPF(Berkeley Packet Filter)语法 2.显示过滤器 一.快捷键 Ctrl+M 标记/取消标记 shift+ctrl+N/B 下 ...
- 常用CSS缩写语法总结
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:#000000可以缩写为#000;#336699可以缩 ...
随机推荐
- 如何使用jmeter连接数据库并提取数据库中的值作为参数,与响应信息中提取的值进行比较
思路: 连接数据库 获取数据库返回的数据 获取接口返回的数据 两者返回数据进行对比验证 连接数据库 1.jmeter要链接mysql数据库,首先得下载mysql jdbc驱动包(注:驱动包的版本一定要 ...
- excel常用函数之find,left,right,mid,len
mid =MID(A2,FIND("时间",A2)+2,10) 第一个 : 提取对象 第二个: 开始位置 第三个: 提取多少 find =FIND(“时间”,A2,1) 第一个: ...
- JS 识别生日、性别、年龄
<script> function IdCard(UUserCard,num){ if(num==1){ //获取出生日期 birth=UUserCard.substring(6, 10) ...
- 洛谷 P3372 【模板】线段树 1
P3372 [模板]线段树 1 题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某区间每一个数加上x 2.求出某区间每一个数的和 输入输出格式 输入格式: 第一行包含两个整数N.M,分别 ...
- 教程 | Linux常用命令大全
Linux常用命令 目录操作命令 ls 命令名称:ls 命令英文原意:list 命令所在路径:/bin/ls 执行权限:所有用户 功能描述:显示目录文件 ls (显示当前目录下文件) ls 目录名 ( ...
- Spring Cloud与Duddo比较(非原创)
文章大纲 一.Spring Cloud与Duddo背景介绍二.Spring Cloud与Duddo比较三.参考文章 一.Spring Cloud与Duddo背景介绍 国内技术人员喜欢拿 Dub ...
- 洛谷P2136 拉近距离
题目背景 我是源点,你是终点.我们之间有负权环. --小明 题目描述 在小明和小红的生活中,有\(N\)个关键的节点.有\(M\)个事件,记为一个三元组\((S_i,T_i,W_i)\),表示从节点\ ...
- Jmeter (二十六)逻辑控制器 之 Module Controller and Include Controller
Module Controller ---模块控制器 测试计划设置“独立运行没每个线程组” 线程组2中使用Module Controller执行线程组1中的Sampler: 紧接着,将线程组1disa ...
- this真题编译
1 x y z分别输出的是什么? var x=1, y=z=0; function add(n){ return n= n+1; }; y=add(x); function add(n){ retu ...
- 题解 P1854 花店橱窗布置
把二维压成一维的DP了解一下... 传送门 (以纪念神经兮兮调了两天的一维DP(刷水题谋财害命)以及感谢学长的帮助@ydnhaha) 显然我们有二维的dp:f[i][j]代表第i盆花放到第j个位置 ; ...