一,说haml之前首先要了解haml是什么：
Haml是一种用来描述任何XHTML web document的标记语言，它是干净，简单的。而且也不用内嵌代码。Haml的职能就是替代那些内嵌代码的page page templating systems，比如PHP,ERB(Rails的模板系统)，ASP。不过，haml避免了直接coding XHTML到模板，因为它实际上是一个xhtml的抽象描述，内部使用一些code来生成动态内容。Haml 是一种简洁优美的模板语言，可以应用于Ruby on Rails、 PHP等Web开发平台，可以大大缩减模板代码，减少冗余，提高可读性。并且Haml是一种完备的模板语言，没有牺牲当前模板语言的任何特性。Haml由 Hampton Catlin发明并且开发了Ruby on Rails上的实现。
二,用haml来简写html
其 实haml和html最大的区别就是没有结束标签，所以haml语言要遵循严格的缩进规则（要缩进2格）。
比如：<p>我是谁</p>要写成：%p
我是谁 （缩进俩空客或者一个Tab）
基本简化规则如下：
1. !!! 5 代表 <!DOCTYPE html>
2. %E 代表HTML标签。
比如：<p></p>=> %p
3. %E#id 代表id属性。
<p id="name"></p>=> %p#name
4. %E(attr="xxx") 代表某一个特定属性。
5. %E XXX 代表插入标签的内容（这样写不太方便最好缩进2格写在下一行）。
6. %E %N 代表N是E的子元素。N如果写在第二行，需要缩进。
7.下面用例子说一下选择器怎么用（一般类选择器就够用了）
%div{:class=>"top"}
%span{:class=>"title"}
订餐
%button{:class=>"back",:onclick=>"jumpheader()"}
Back
其中：%div{:class=>"top"}就相当于html中的：<div class="top"></div>。
相关推荐
哈姆 Haml是HTML的模板引擎。 通过消除冗余，反映文档所表示的基础结构以及提供既强大又易于理解的优雅语法，它旨在使编写HTML文档变得更加轻松愉快。...格式化Haml的最基本元素是创建HTML的简写： % ta
本文主要探讨了两个有助于HTML和CSS编码效率提升的工具和技术：HTML缩写编码技术和CSS编译器。 首先，HTML缩写编码技术是通过简化的语法快速生成完整的HTML标记。例如，输入`#container`可以自动扩展为`...
1. **预处理器**：如Pug（前身为Jade）或Haml，它们提供了一种简洁的语法来编写HTML，使代码更易于阅读和维护。预处理器允许开发者使用更抽象的语言编写模板，然后编译成标准的HTML。 2. **框架和库**：例如...
除了HTML之外，Zen Coding还支持XML、XSL、CSS和HAML等格式的缩写扩展。由于Zen Coding的设计初衷是简化编码工作，它同样可以用于其他标记语言的快速编写。 在使用Zen Coding时，用户需要注意快捷键可能与其他软件...
"so"是"shared object"的缩写，是Linux下的动态库扩展名。 描述中的“shakeit.so”没有提供太多额外的信息，可能是为了保密或者简洁，只提到了文件的名称。通常，这样的描述可能暗示这是一个具有某种特定功能的库，...
使用HTML片段，如Zen Coding（现称Emmet）和HAML，可以快速生成HTML结构。这些工具通过简短的缩写自动扩展为完整的HTML代码，不仅提高编写速度，还能减少手动输入时可能出现的错误。 3. **CSS重设**（CSS Reset） ...
此外，预处理器如HTML preprocessors（如Haml、Jade，现在多称为Pug）可以帮助简化HTML代码，提高编写效率。 提到的“lmsi-master”可能是一个项目或库的主分支，常见于Git版本控制系统中。"master"分支通常被视为...
10. **工具与框架**：开发者常使用HTML预处理器（如Pug或Haml）或前端框架（如Bootstrap、Angular或React）来简化HTML的编写和维护。 以上内容涵盖了HTML的基本概念和重要知识点，对于理解网页开发的基础至关重要。...
官网 习惯jade的最好办法：找一个已写好的html代码，用jade重写一遍但是如果你是新手，而且直接拿jade写没有写过的页面，那么你会死的很难看规则说明标签简写比如`<p>`写成`p`jade里的p等于<p></p>属性放到括号里...
例Emma.css类缩写声明（缩写） 。D b D b 显示：块； .d-fx d-fx 显示：flex; 。嘛嘛marign：自动； .m0 00 边距：0; ― 5米边距：-5px; .w1 w1 宽度：1px； .h100p h100p 高度：100％; .mah50vh mah50vh 最大高度：...