<!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>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
