<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Emmet语法</title></head><body><!-- 1. 标签与内容 --><h3>html是结构化标签语言</h3><div class="">默认标签div</div><!-- 2. 属性与语法糖 [键值对]{内容} --><!-- [id=app]{app} --><div id="app">app</div><!-- [class="title"]{title} --><div class="title">title</div><!-- #app{app1} --><div id="app">app1</div><!-- .title{title} --><div class="title">title</div><!-- 3. 重复: '*' --><!-- .container{box}*3 --><div class="contarner">box</div><div class="contarner">box</div><div class="contarner">box</div><!-- 4. 父与子: `*` --><!-- ul>li{item}*3 --><ul><li>item</li><li>item</li><li>item</li></ul><!-- 5. 兄弟关系: `+` --><!-- h3{标题}+p{内容} --><h3>标题</h3><p>内容</p><!-- 6. 父级: '^' --><!-- .box>span{text}^h3{小标题} --><div class="box"><span>text</span></div><h3>小标题</h3><!-- 7. 分组: '(...)' --><!-- nav>h3{导航}+ul>li*3>a{link} --><nav><h3>导航</h3><ul><li><a href="">link</a></li><li><a href="">link</a></li><li><a href="">link</a></li></ul></nav><!-- 8. 序号: '$','$@3' --><!-- ul>li{item-$@3}*3 --><ul><li>item-3</li><li>item-4</li><li>item-5</li></ul></body></html>
博客列表 >【HTML】Emmet 语法总结 [html基础]
【HTML】Emmet 语法总结 [html基础]
- 可乐随笔原创转载
- 2022年11月27日 20:51:33354浏览
上一条：【HTML】渲染方式下一条：【HTML】文档结构与元素，标签，属性的类型
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议