Emmet速查表
📝 文章教程
·
🕐 2025-07-29
·
👁 1 次
📌 摘要：Emmet HTML结构与CSS缩写速查
在支持Emmet的编辑器中输入缩写按Tab展开。
| 🏗️ 结构 | |
|---|---|
div 或 ! | 生成div / HTML5文档骨架 |
div.container | 生成带class的div |
ul>li*3 | 父子+重复3项 |
div+p+bq | 兄弟标签 |
div+div>p>span+em | 链式层级 |
table>tr*3>td*4 | 表格快速结构 |
| 🏷️ 属性文本 | |
a[href="#"] | 带属性 |
input:button / input:email | input类型 |
p{文本} | 带文本内容 |
h${标题$}*3 | 编号递增标题1-3 |
lorem / lorem10 | 占位段落/10个单词 |
img:s / img:z | 图片尺寸占位 |
| 🔢 CSS | |
w100 / h50 | width:100px / height:50px |
m10 / p20-10 | margin / padding（上下-左右） |
fz16 / lh1.5 | font-size / line-height |
bd / bdrs8 | 边框 / 圆角8px |
dib / df / poa | inline-block / flex / absolute |
💬 用户评论
还没有评论